解决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 刷新全集常用代码
Nov 22 Javascript
js 变量类型转换常用函数与代码[比较全]
Dec 01 Javascript
Javascript 网页黑白效果实现代码(兼容IE/FF等)
Apr 23 Javascript
纯JS实现的批量图片预览加载功能
Aug 14 Javascript
javascript检查表单数据是否改变的方法
Jul 30 Javascript
JQuery拖动表头边框线调整表格列宽效果代码
Sep 10 Javascript
使用Vue.js创建一个时间跟踪的单页应用
Nov 28 Javascript
利用Node.js+Koa框架实现前后端交互的方法
Feb 27 Javascript
javascript 中关于array的常用方法详解
May 05 Javascript
解决Vue-cli npm run build生产环境打包,本地不能打开的问题
Sep 20 Javascript
基于Vue2-Calendar改进的日历组件(含中文使用说明)
Apr 14 Javascript
JS将时间秒转换成天小时分钟秒的字符串
Jul 10 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
PHP下用rmdir实现删除目录的三种方法小结
2008/04/20 PHP
初学CAKEPHP 基础教程
2009/11/02 PHP
curl实现站外采集的方法和技巧
2014/01/31 PHP
php微信开发接入
2016/08/27 PHP
如何修改yii2.0自带的user表为其它的表
2017/08/01 PHP
PHP定义字符串的四种方式详解
2018/02/06 PHP
php解决crontab定时任务不能写入文件问题的方法分析
2019/09/16 PHP
JS 面向对象的5钟写法
2009/07/31 Javascript
MooTools 1.2中的Drag.Move来实现拖放
2009/09/15 Javascript
javascript省市区三级联动下拉框菜单实例演示
2015/11/29 Javascript
Angular发布1.5正式版,专注于向Angular 2的过渡
2016/02/18 Javascript
漫谈JS引擎的运行机制 你应该知道什么
2016/06/15 Javascript
基于JavaScript实现前端文件的断点续传
2016/10/17 Javascript
JQuery form表单提交前验证单选框是否选中、删除记录时验证经验总结(整理)
2017/06/09 jQuery
Validform验证时可以为空否则按照指定格式验证
2017/10/20 Javascript
通过实例解析JavaScript for in及for of区别
2020/06/15 Javascript
Python实现把回车符\r\n转换成\n
2015/04/23 Python
简单介绍Python中的round()方法
2015/05/15 Python
Python实现简单HTML表格解析的方法
2015/06/15 Python
使用Python编写基于DHT协议的BT资源爬虫
2016/03/19 Python
Python编程求解二叉树中和为某一值的路径代码示例
2018/01/04 Python
使用python采集脚本之家电子书资源并自动下载到本地的实例脚本
2018/10/23 Python
pytorch 调整某一维度数据顺序的方法
2018/12/08 Python
Python字符串对象实现原理详解
2019/07/01 Python
python使用 request 发送表单数据操作示例
2019/09/25 Python
PyCharm2019安装教程及其使用(图文教程)
2019/09/29 Python
python用quad、dblquad实现一维二维积分的实例详解
2019/11/20 Python
利用Python中的Xpath实现一个在线汇率转换器
2020/09/09 Python
使用CSS3美化HTML表单的技巧演示
2016/05/17 HTML / CSS
使用HTML5的表单验证的简单示例
2015/09/09 HTML / CSS
毕业生动漫设计求职信
2013/10/11 职场文书
知识竞赛活动方案
2014/02/18 职场文书
村干部培训班主持词
2014/03/28 职场文书
《放飞蜻蜓》教学反思
2014/04/27 职场文书
2015年前台接待工作总结
2015/05/04 职场文书
校车司机安全责任书
2015/05/11 职场文书