解决layer 关闭当前弹窗 关闭遮罩层 input值获取不到的问题


Posted in Javascript onSeptember 25, 2019

弹出某个层时需要给层取名(赋值)

var = ggLayer = layer.open({
        type: 1,
        content: $('.choose-gg').html(),
        anim: 'up',
        style: 'position:fixed; bottom:0; left:0; width: 100%; height: auto; padding:10px 0; border:none;'
       });

layer.closeAll(); 关闭遮罩层

layer.close(ggLayer);关闭弹窗

使用layer.open弹出页面时,将页面内容设入content属性中,有时候直接将页面的元素放进来,比如$("xxx").html().

容易掉进坑的地方来了,这样设置实质是layer将你的页面html复制出来一份,新生成的弹出框已经不是你原来写的了

所以,如果你给input起了个id并用id获取input的值,实质上获取的是原本页面的input的值(第一个input),不是layer生成的页面的input(第二个input),而你输入的地方是layer生成的input(第二个),所以只能获得input默认自带的值而获取不到刚输入的值。

解决办法:

给input起个class,不要id,获取input的值得时候要用$(".xxx").eq(1).val(),获取生成的第二个input的值,你会发现成功可以获取了

console.log($(".reasonContent2").eq(1).val())

以上这篇解决layer 关闭当前弹窗 关闭遮罩层 input值获取不到的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jquery获取一个元素下面相同子元素的个数代码
Jul 31 Javascript
JS+Canvas绘制时钟效果
Aug 20 Javascript
移动适配的几种方案(三种方案)
Nov 25 Javascript
微信小程序利用co处理异步流程的方法教程
May 20 Javascript
解决canvas画布使用fillRect()时高度出现双倍效果的问题
Aug 03 Javascript
浅谈Angular路由复用策略
Oct 04 Javascript
vue监听键盘事件的快捷方法【推荐】
Jul 11 Javascript
浅谈vuex actions和mutation的异曲同工
Dec 13 Javascript
微信小程序自定义键盘 内部虚拟支付
Dec 20 Javascript
解决vue组件销毁之后计时器继续执行的问题
Jul 21 Javascript
原生JavaScript实现弹幕组件的示例代码
Oct 12 Javascript
全面解析Vue中的$nextTick
Dec 24 Vue.js
微信小程序实现一张或多张图片上传(云开发)
Sep 25 #Javascript
Layer组件多个iframe弹出层打开与关闭及参数传递的方法
Sep 25 #Javascript
layer 关闭指定弹出层的例子
Sep 25 #Javascript
layer关闭弹出窗口触发表单提交问题的处理方法
Sep 25 #Javascript
layer弹窗在键盘按回车将反复刷新的实现方法
Sep 25 #Javascript
Vue 实现一个命令式弹窗组件功能
Sep 25 #Javascript
layui prompt 设置允许空白提交的方法
Sep 24 #Javascript
You might like
php smarty模版引擎中的缓存应用
2009/12/11 PHP
php中使用addslashes函数报错问题的解决方法
2013/02/06 PHP
php引用返回与取消引用的详解
2013/06/08 PHP
微信公众平台开发教程①获取用户Openid及个人信息图文详解
2019/04/10 PHP
有关PHP 中 config.m4 的探索
2020/08/26 PHP
js左侧多级菜单动态的解决方案
2010/02/01 Javascript
使用隐藏的new来创建对象
2011/03/29 Javascript
基于jquery的$.ajax async使用
2011/10/19 Javascript
JavaScript模板入门介绍
2012/09/26 Javascript
jQuery实现返回顶部功能适合不支持js的浏览器
2014/08/19 Javascript
轻松掌握JavaScript状态模式
2016/09/07 Javascript
Vue2.0使用过程常见的一些问题总结学习
2017/04/10 Javascript
socket.io与pm2(cluster)集群搭配的解决方案
2017/06/02 Javascript
bootstrap选项卡扩展功能详解
2017/06/14 Javascript
详解微信图片防盗链“此图片来自微信公众平台 未经允许不得引用”的解决方案
2019/04/04 Javascript
Vue源码分析之Vue实例初始化详解
2019/08/25 Javascript
微信小程序实现同时上传多张图片
2020/02/03 Javascript
vue移动端写的拖拽功能示例代码
2020/09/09 Javascript
[03:48]显微镜下的DOTA2第四期——TP动作
2014/06/20 DOTA
python装饰器使用方法实例
2013/11/21 Python
python计算书页码的统计数字问题实例
2014/09/26 Python
Python简单生成随机数的方法示例
2018/03/31 Python
详解Python 装饰器执行顺序迷思
2018/08/08 Python
django进阶之cookie和session的使用示例
2018/08/17 Python
浅谈Scrapy网络爬虫框架的工作原理和数据采集
2019/02/07 Python
python中import与from方法总结(推荐)
2019/03/21 Python
python实现银联支付和支付宝支付接入
2019/05/07 Python
英国网络托管和域名领导者:Web Hosting UK
2017/10/15 全球购物
SAZAC的动物连体衣和动物睡衣:Kigurumi Shop
2020/03/14 全球购物
高考自主招生自荐信
2013/10/20 职场文书
师德学习感言
2014/01/31 职场文书
人力资源管理毕业求职信
2014/08/05 职场文书
挂职学习心得体会
2014/09/09 职场文书
公务员政审材料范文
2014/12/23 职场文书
解决Laravel使用验证时跳转到首页的问题
2021/11/17 PHP
volatile保证可见性及重排序方法
2022/08/05 Java/Android