解决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 相关文章推荐
JavaScript 克隆数组最简单的方法
Feb 12 Javascript
关于document.cookie的使用javascript
Oct 29 Javascript
25个非常棒的jQuery滑块插件和教程小结
Sep 02 Javascript
基于JQuery的模拟苹果桌面Dock效果(稳定版)
Oct 15 Javascript
JS判断字符串长度的5个方法(区分中文和英文)
Mar 18 Javascript
轻量级javascript 框架Backbone使用指南
Jul 24 Javascript
js无法获取到html标签的属性的解决方法
Jul 26 Javascript
HTML中setCapture、releaseCapture 使用方法浅析
Sep 25 Javascript
移动端滑动插件Swipe教程
Oct 16 Javascript
使用vue制作FullPage页面滚动效果
Aug 21 Javascript
react项目如何使用iconfont的方法步骤
Mar 13 Javascript
基于Vue全局组件与局部组件的区别说明
Aug 11 Javascript
微信小程序实现一张或多张图片上传(云开发)
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
一些花式咖啡的配方
2021/03/03 冲泡冲煮
php 301转向实现代码
2008/09/18 PHP
php-redis中的sort排序函数总结
2015/07/08 PHP
Yii2验证器(Validator)用法分析
2016/07/23 PHP
PHPStrom 新建FTP项目以及在线操作教程
2016/10/16 PHP
PHP 7安装使用体验之性能大提升,兼容性强,扩展支持不够(升级PHP要谨慎)
2017/07/27 PHP
关于IE BUG与字符串截取substr的解决办法
2013/04/10 Javascript
js 时间函数应用加、减、比较、格式转换的示例代码
2013/08/23 Javascript
jquery删除指定子元素代码实例
2015/01/13 Javascript
javascript运算符——位运算符全面介绍
2016/07/14 Javascript
Angular中使用ui router实现系统权限控制及开发遇到问题
2016/09/23 Javascript
深入探究angular2 UI组件之primeNG用法
2017/07/26 Javascript
深入理解js 中async 函数的含义和用法
2018/05/13 Javascript
vue addRoutes实现动态权限路由菜单的示例
2018/05/15 Javascript
深入浅析AngularJs模版与v-bind
2018/07/06 Javascript
微信小程序提交form操作示例
2018/12/30 Javascript
bootstrap 日期控件 datepicker被弹出框dialog覆盖的解决办法
2019/07/09 Javascript
Vue实现 点击显示再点击隐藏效果(点击页面空白区域也隐藏效果)
2020/01/16 Javascript
vue+openlayers绘制省市边界线
2020/12/24 Vue.js
[04:26]2014DOTA2西雅图国际邀请赛 总决赛TOPPLAY
2014/07/22 DOTA
Python 列表(List)操作方法详解
2014/03/11 Python
python base64 decode incorrect padding错误解决方法
2015/01/08 Python
Python随机生成手机号、数字的方法详解
2017/07/21 Python
Python中对象的引用与复制代码示例
2017/12/04 Python
Python文本处理之按行处理大文件的方法
2018/04/09 Python
Python3.6日志Logging模块简单用法示例
2018/06/14 Python
Scrapy框架实现的登录网站操作示例
2020/02/06 Python
TensorFlow的reshape操作 tf.reshape的实现
2020/04/19 Python
keras训练曲线,混淆矩阵,CNN层输出可视化实例
2020/06/15 Python
没编程基础可以学python吗
2020/06/17 Python
css3制作彩色边线3d立体按钮的示例(css3按钮)
2014/05/06 HTML / CSS
机电一体化毕业生求职信
2013/11/02 职场文书
2015年119消防宣传日活动总结
2015/03/24 职场文书
2015年安全员工作总结范文
2015/04/22 职场文书
Python爬虫基础讲解之请求
2021/05/13 Python
Python可视化神器pyecharts绘制地理图表
2022/07/07 Python