解决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 相关文章推荐
关于文本限制字数的js代码
Apr 02 Javascript
jquery中防刷IP流量软件影响统计的一点对策
Jul 10 Javascript
jquery中event对象属性与方法小结
Dec 18 Javascript
JS遍历Json字符串中键值对先转成JSON对象再遍历
Aug 15 Javascript
JavaScript获取网页中第一个图片id的方法
Apr 03 Javascript
利用jsonp跨域调用百度js实现搜索框智能提示
Aug 24 Javascript
js使用Replace结合正则替换重复出现的字符串功能示例
Dec 27 Javascript
vue脚手架vue-cli的学习使用教程
Jun 06 Javascript
使用JS组件实现带ToolTip验证框的实例代码
Aug 23 Javascript
vue复合组件实现注册表单功能
Nov 06 Javascript
Node.js 使用AngularJS的方法示例
May 11 Javascript
Element-ui Layout布局(Row和Col组件)的实现
Dec 06 Vue.js
防止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
用php实现的获取网页中的图片并保存到本地的代码
2010/01/05 PHP
php木马webshell扫描器代码
2012/01/25 PHP
php中禁止单个IP与ip段访问的代码小结
2012/07/04 PHP
PHP实现的QQ空间g_tk加密算法
2015/07/09 PHP
ThinkPHP的常用配置选项汇总
2016/03/24 PHP
PHP PDOStatement::getColumnMeta讲解
2019/02/01 PHP
javascript 同时在IE和FireFox获取KeyCode的代码
2010/02/07 Javascript
javascript:void(0)使用探讨
2013/08/27 Javascript
jQuery使用之处理页面元素用法实例
2015/01/19 Javascript
Jquery操作Ajax方法小结
2015/11/29 Javascript
浅谈js图片前端预览之filereader和window.URL.createObjectURL
2016/06/30 Javascript
gulp-uglify 与gulp.watch()配合使用时报错(重复压缩问题)
2016/08/24 Javascript
微信小程序之绑定点击事件实例详解
2017/07/07 Javascript
详解基于Koa2开发微信二维码扫码支付相关流程
2018/05/16 Javascript
react+ant design实现Table的增、删、改的示例代码
2018/12/27 Javascript
VUEX 数据持久化,刷新后重新获取的例子
2019/11/12 Javascript
vue实现分页加载效果
2019/12/24 Javascript
举例详解Python中的split()函数的使用方法
2015/04/07 Python
Python实现的单向循环链表功能示例
2017/11/10 Python
Python实现购物车功能的方法分析
2017/11/10 Python
Python中时间datetime的处理与转换用法总结
2019/02/18 Python
基于Django signals 信号作用及用法详解
2020/03/28 Python
Python 字符串池化的前提
2020/07/03 Python
js实现移动端H5页面手指滑动刻度尺功能
2017/11/16 HTML / CSS
HTML5 b和i标记将被赋予真正的语义
2009/07/16 HTML / CSS
Sport-Thieme荷兰:购买体育用品
2019/08/25 全球购物
编码转换,怎样实现将GB2312编码的字符串转换为ISO-8859-1编码的字符串
2014/01/07 面试题
社区八一活动方案
2014/02/03 职场文书
放飞蜻蜓反思
2014/02/05 职场文书
《骆驼和羊》教学反思
2014/02/27 职场文书
幸福中国演讲稿
2014/09/12 职场文书
法人授权委托书样本
2014/09/19 职场文书
2014年客服工作总结范文
2014/11/13 职场文书
投资入股协议书
2016/03/22 职场文书
netty 实现tomcat的示例代码
2022/06/05 Servers
JavaScript圣杯布局与双飞翼布局实现案例详解
2022/08/05 Javascript