叶雨梧桐BLOG

解决layer弹窗获取不到内容的问题

发布时间:2017年2月12日 / 分类:前端笔记 / 吐槽

重要的教训讲三遍

不仔细看文档做开发活该浪费时间!
不仔细看文档做开发活该浪费时间!
不仔细看文档做开发活该浪费时间!

问题描述

开发中使用到了layer弹窗组件,遇到了一个比较神奇的情况,jquery获取不到弹窗中input修改后的值,只能获取到初始的值。
尝试了text,val,attr 各种方法,都无法正常获取值。当弹窗dom部分固定在页面上时会出现这种情况,如果dom部分是动态加载的话,则能正常获取到修改后的值。

出问题的代码,以下如果使用$("#tag").val()获取值,无论选择哪个分类,总是为1
html部分

<div id="hellodemo">
<select id='tag'>
            <option value="1">分类1</option>
            <option value="2">分类2</option>
            <option value="3">分类3</option>
            <option value="4">分类4</option>
        </select>
</div>

js部分

var helloContent = $("#hellodemo").html();
$("#add").click(function(){
    layer.open({
      type: 1,
      skin: 'layui-layer-rim', 
      area: ['420px', '240px'],
      content: helloContent
    });
});

正常的代码,以下代码可正常使用
html部分

<div id="hellodemo">
<select id='tag'>
            <option value="1">分类1</option>
            <option value="2">分类2</option>
            <option value="3">分类3</option>
            <option value="4">分类4</option>
        </select>
</div>

js部分

$("#add").click(function(){
    layer.open({
      type: 1,
      skin: 'layui-layer-rim', 
      area: ['420px', '240px'],
      content: $("#hellodemo")
    });
});

问题原因

layer.open中的content是有多种形式的,可存在string,array,dom等等。出错的部分是因为获取原dom数据后传递过去的,做字符串处理了,所以无论怎样获取,怎样修改,都只会获取初始值1.修改成dom形式即可。另一种处理方式,则是将dom动态js添加,则能正常使用。

参考文档

http://www.layui.com/doc/modules/layer.html

标签:没有标签呢

版权声明:除特殊注明外,均由叶雨梧桐原创,转载请保留文章出处;
本文链接:http://gt520.com/qdbj/372.html
订阅叶雨梧桐BLOG RSS
分类
最新文章
最近回复
  • 梦青年: 我的网站下线了,你可以把我的友链去掉了,感谢多年的支持和关注~ 梦青年。
  • 便宜VPS: 已添加贵站链接,我站:https://www.vultrclub.com,站:便宜VPS
  • vultr: 朋友 交换链接吗
  • 罗小黑: py小白看不懂啊! Traceback (most recent call last): ...
  • 罗小黑: 安装出错,下面无法继续 >>> pip install MySQL-python Synt...
  • 一抹阳光: 学习了(ಡωಡ)
  • wu先生: 我来了。
  • 欣欣: 嗷呜 原来树莓派不是吃的
  • 繁华落尽: 我也是碰到了这种问题,求具体解决方案,谢谢
  • aaa365: 128M小内存 npm install -g hexo-cli 的时候直接就被系统kill掉进...
归档