解决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 相关文章推荐
jWiard 基于JQuery的强大的向导控件介绍
Oct 28 Javascript
js事件(Event)知识整理
Oct 11 Javascript
JavaScript中使用ActiveXObject操作本地文件夹的方法
Mar 28 Javascript
jquery实现更改表格行顺序示例
Apr 30 Javascript
js阻止事件追加的具体实现
Oct 15 Javascript
使用js获取地址栏参数的方法推荐(超级简单)
Jun 14 Javascript
jQuery实现邮箱下拉列表自动补全功能
Sep 08 Javascript
利用jquery实现实时更新歌词的方法
Jan 06 Javascript
微信小程序 设置启动页面的两种方法
Mar 09 Javascript
详解Vue.js iview实现树形权限表(可扩展表)
Sep 30 Javascript
vue实现todolist基本功能以及数据存储功能实例详解
Apr 11 Javascript
vue学习笔记之slot插槽基本用法实例分析
Feb 01 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安全性需要注意的几点事项
2014/07/17 PHP
php 反斜杠处理函数addslashes()和stripslashes()实例详解
2016/12/25 PHP
PHP 断点续传实例详解
2017/11/11 PHP
不用MOUSEMOVE也能滑动啊
2007/05/23 Javascript
IE FF OPERA都可用的弹出层实现代码
2009/09/29 Javascript
Jquery Change与bind事件代码
2011/09/29 Javascript
iframe的onreadystatechange事件在firefox下的使用
2014/04/16 Javascript
60个很实用的jQuery代码开发技巧收集
2014/12/15 Javascript
jQuery实现列表的全选功能
2015/03/18 Javascript
使用NodeJs 开发微信公众号(三)微信事件交互实例
2016/03/02 NodeJs
JS组件Bootstrap按钮组与下拉按钮详解
2016/05/10 Javascript
BootStrap注意事项小结(五)表单
2017/03/10 Javascript
ExtJs的Ext.Ajax.request实现waitMsg等待提示效果
2017/06/14 Javascript
springmvc接收jquery提交的数组数据代码分享
2017/10/28 jQuery
vuejs实现本地数据的筛选分页功能思路详解
2017/11/15 Javascript
nodejs操作mongodb的填删改查模块的制作及引入实例
2018/01/02 NodeJs
CountUp.js数字滚动插件使用方法详解
2019/10/17 Javascript
在vue中实现禁止屏幕滚动,禁止屏幕滑动
2020/07/22 Javascript
Angular+ionic实现折叠展开效果的示例代码
2020/07/29 Javascript
js数组中去除重复值的几种方法
2020/08/03 Javascript
vue的hash值原理也是table切换实例代码
2020/12/14 Vue.js
Python使用cookielib模块操作cookie的实例教程
2016/07/12 Python
Python批量更改文件名的实现方法
2017/10/29 Python
Python爬虫抓取代理IP并检验可用性的实例
2018/05/07 Python
python3监控CentOS磁盘空间脚本
2018/06/21 Python
如何基于python操作json文件获取内容
2019/12/24 Python
Python telnet登陆功能实现代码
2020/04/16 Python
Django与pyecharts结合的实例代码
2020/05/13 Python
中国电子产品外贸网站:MiniIntheBox
2017/02/06 全球购物
Oracle里面常用的数据字典有哪些
2014/02/14 面试题
自荐书格式
2013/12/01 职场文书
大学毕业感言
2014/01/10 职场文书
优秀大学生的自我评价
2014/01/16 职场文书
晚会邀请函范文
2014/01/24 职场文书
Python selenium的这三种等待方式一定要会!
2021/06/10 Python
排查MySQL生产环境索引没有效果
2022/04/11 MySQL