解决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 相关文章推荐
Javascript中的数学函数集合
May 08 Javascript
JavaScript Perfection kill 测试及答案
Mar 23 Javascript
onmouseover和onmouseout的一些问题思考
Aug 14 Javascript
js实现input密码框提示信息的方法(附html5实现方法)
Jan 14 Javascript
Linux下为Node.js程序配置MySQL或Oracle数据库的方法
Mar 19 Javascript
node.js连接mongoDB数据库 快速搭建自己的web服务
Apr 17 Javascript
seajs学习教程之基础篇
Oct 20 Javascript
AngularJS自定义过滤器用法经典实例总结
May 17 Javascript
深入浅析angular和vue还有jquery的区别
Aug 13 jQuery
vue 双向数据绑定的实现学习之监听器的实现方法
Nov 30 Javascript
vue中动态select的使用方法示例
Oct 28 Javascript
基于JS实现计算24点算法代码实例解析
Jul 23 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
PHP命名空间(Namespace)简明教程
2014/06/11 PHP
CodeIgniter实现更改view文件夹路径的方法
2014/07/04 PHP
Yii使用migrate命令执行sql语句的方法
2016/03/15 PHP
php mysql实现mysql_select_db选择数据库
2016/12/30 PHP
php插入mysql数据返回id的方法
2018/05/31 PHP
php微信公众号开发之秒杀
2018/10/20 PHP
thinkphp5 框架结合plupload实现图片批量上传功能示例
2020/04/04 PHP
JavaScript高级程序设计阅读笔记(六) ECMAScript中的运算符(二)
2012/02/27 Javascript
使用js修改客户端注册表的方法
2013/08/09 Javascript
JS将秒换成时分秒实现代码
2013/09/03 Javascript
js抽奖实现随机抽奖代码效果
2013/12/02 Javascript
node.js中的fs.utimesSync方法使用说明
2014/12/15 Javascript
jQuery图片拖动组件Dropzone用法示例
2017/01/17 Javascript
three.js实现围绕某物体旋转
2017/01/25 Javascript
thinkjs之页面跳转同步异步操作
2017/02/05 Javascript
JavaScript运动框架 链式运动到完美运动(五)
2017/05/18 Javascript
利用原生JavaScript实现造日历轮子实例代码
2019/05/08 Javascript
微信小程序开发之左右分栏效果的实例代码
2019/05/20 Javascript
javascript实现移动端上传图片功能
2020/08/18 Javascript
python机器学习理论与实战(二)决策树
2018/01/19 Python
Python实现批量压缩图片
2018/01/25 Python
Python用for循环实现九九乘法表
2018/05/31 Python
python实现向微信用户发送每日一句 python实现微信聊天机器人
2019/03/27 Python
python opencv 图像拼接的实现方法
2019/06/27 Python
使用tensorflow DataSet实现高效加载变长文本输入
2020/01/20 Python
Python实现ATM系统
2020/02/17 Python
Python爬虫实战案例之爬取喜马拉雅音频数据详解
2020/12/07 Python
马来西亚网上购物平台:ezbuy
2018/02/13 全球购物
美国购买新书和二手书网站:Better World Books
2018/10/31 全球购物
致短跑运动员广播稿
2014/01/09 职场文书
医学专业职业生涯规划范文
2014/02/05 职场文书
幼儿教师师德演讲稿
2014/05/06 职场文书
总经理助理岗位职责范本
2014/07/20 职场文书
党校毕业个人总结
2015/02/28 职场文书
2015年敬老院工作总结
2015/05/18 职场文书
python编写函数注意事项总结
2021/03/29 Python