解决layer.open弹出框不能获取input框的值为空的问题


Posted in Javascript onSeptember 10, 2019

最近使用layer框架来做页面弹出框操作。总是不能获取弹出框中input的值,代码如下:红色标记区域

添加js代码

//Ajax添加品牌
 function addBrandWI(){
 layer.open({
  type: 0,
  title: '品牌添加',
  shadeClose: true,
  shade: 0.8,
  btn: ['保存', '取消'],
  area: ['40%', '70%'],
  content: $('#add_Brand').html(),
  yes:function(index, layero){
  subForm();
  layer.close(index);
  },cancel: function(){}
 }); 
 }
 
 function subForm(){
 var bname=$("#brandname").val();
 $.ajax({
   url: 'salecenter.jsp?act=savaBrand&bname='+bname,
   type: "GET",
   dataType: "json", //返回json格式的数据
   async: true,
   success: function (data) {
    if (data == '0') {
    layer.alert("品牌添加成功");
    } else if(data == '1'){
    layer.alert("品牌添加失败");
    }else if(data == '2'){
    layer.alert("此品牌已经存在");
    }
   }, error: function() {
   }
  });
 }

添加html代码

<!-- 弹出框添加品牌 -->
<div id="add_Brand" style="display:none;">
 <form autocomplete="off" id="sub_form" method="post">
  <div class="add_model">
  <div>
  <b class="out">*</b>品牌名称:
  </div>
  <div>
  <input name="brandname" id="brandname" type="text" value=""/>
  </div>
  </div>
 </form>
</div>

弹出框如下图:

解决layer.open弹出框不能获取input框的值为空的问题

点击保存就是不能获取input的值,总是为空字符串。

后来在网上查找资料,原来这是个比较普遍的bug,原来是layer.open的content参数(上面红色标记代码),应该写成

content: $('#add_Brand'),不要后面的html(),去掉后调试正常获取了input的值,解决问题就行,也没有去深究这个是什么原因(关键也没那个时间)。

以上这篇解决layer.open弹出框不能获取input框的值为空的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
[原创]图片分页查看
Aug 28 Javascript
仅用[]()+!等符号就足以实现几乎任意Javascript代码
Mar 01 Javascript
关于javascript event flow 的一个bug详解
Sep 17 Javascript
Shell脚本实现Linux系统和进程资源监控
Mar 05 Javascript
js改变embed标签src值的方法
Apr 10 Javascript
详解webpack编译多页面vue项目的配置问题
Dec 11 Javascript
Angular5中调用第三方js插件的方法
Feb 26 Javascript
angular4 JavaScript内存溢出问题
Mar 06 Javascript
微信小程序实现手指触摸画板
Jul 09 Javascript
JavaScript实现单图片上传并预览功能
Sep 30 Javascript
详解React 条件渲染
Jul 08 Javascript
VUE前端从后台请求过来的数据进行转换数据结构操作
Nov 11 Javascript
防止Layui form表单重复提交的实现方法
Sep 10 #Javascript
关于layui 弹出层一闪而过就消失的解决方法
Sep 09 #Javascript
解决layer弹出层中表单不起作用的问题
Sep 09 #Javascript
解决layui弹框失效的问题
Sep 09 #Javascript
vue给对象动态添加属性和值的实例
Sep 09 #Javascript
关于layui表单中按钮自动提交的解决方法
Sep 09 #Javascript
layui原生表单验证的实例
Sep 09 #Javascript
You might like
一个可以删除字符串中HTML标记的PHP函数
2006/10/09 PHP
php adodb连接带密码access数据库实例,测试成功
2008/05/14 PHP
php的zip解压缩类pclzip使用示例
2014/03/14 PHP
php实现模拟post请求用法实例
2015/07/11 PHP
php多线程实现方法及用法实例详解
2015/10/26 PHP
php批量删除操作(数据访问)
2017/05/23 PHP
谈谈关于JavaScript 中的 MVC 模式
2013/04/11 Javascript
原始的js代码和jquery对比体会
2013/09/10 Javascript
JQuery节点元素属性操作方法
2015/06/11 Javascript
对象题目的一个坑 理解Javascript对象
2015/12/22 Javascript
javascript中的作用域和闭包详解
2016/01/13 Javascript
[原创]JS基于FileSaver.js插件实现文件保存功能示例
2016/12/08 Javascript
nodejs dgram模块广播+组播的实现示例
2019/11/04 NodeJs
js 计算月/周的第一天和最后一天代码
2020/02/01 Javascript
全网小程序接口请求封装实例代码
2020/11/06 Javascript
python的dict,set,list,tuple应用详解
2014/07/24 Python
Python中的高级数据结构详解
2015/03/27 Python
Python使用剪切板的方法
2017/06/06 Python
Python通过matplotlib画双层饼图及环形图简单示例
2017/12/15 Python
对Python 3.2 迭代器的next函数实例讲解
2018/10/18 Python
浅谈python新式类和旧式类区别
2019/04/26 Python
基于Python+Appium实现京东双十一自动领金币功能
2019/10/31 Python
从多个tfrecord文件中无限读取文件的例子
2020/02/17 Python
使用PDF.JS插件在HTML中预览PDF文件的方法
2018/08/29 HTML / CSS
Maje德国官网:法国女性成衣品牌
2017/02/10 全球购物
卡西欧G-SHOCK英国官网: 防水防震手表
2018/01/08 全球购物
印尼在线购买隐形眼镜网站:Lensza.co.id
2019/04/27 全球购物
DIY手工制作经营店创业计划书
2014/02/01 职场文书
职工运动会邀请函
2014/02/02 职场文书
工厂会计员职责
2014/02/06 职场文书
党的群众路线教育实践活动心得体会
2014/03/03 职场文书
财务工作疏忽检讨书
2014/09/11 职场文书
迎新生标语大全
2014/10/06 职场文书
汽车销售助理岗位职责
2015/04/14 职场文书
农村党支部承诺书
2015/04/30 职场文书
食品卫生管理制度
2015/08/06 职场文书