解决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 相关文章推荐
jquery判断checkbox(复选框)是否被选中的代码
Oct 20 Javascript
jquery.cookie用法详细解析
Dec 18 Javascript
JQuery解析HTML、JSON和XML实例详解
Mar 29 Javascript
JavaScript使用function定义对象并调用的方法
Mar 23 Javascript
JavaScript File API文件上传预览
Feb 02 Javascript
Bootstrap开发实战之第一次接触Bootstrap
Jun 02 Javascript
Vue.js在使用中的一些注意知识点
Apr 29 Javascript
微信小程序实现打开内置地图功能【附源码下载】
Dec 07 Javascript
JS中Object对象的原型概念基础
Jan 29 Javascript
vue-cli开发时,关于ajax跨域的解决方法(推荐)
Feb 03 Javascript
vue keep-alive列表页缓存 详情页返回上一页不刷新,定位到之前位置
Nov 26 Javascript
js 获取本周、上周、本月、上月、本季度、上季度的开始结束日期
Feb 01 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类常量的使用详解
2013/06/08 PHP
解析如何通过PHP函数获取当前运行的环境 来进行判断执行逻辑(小技巧)
2013/06/25 PHP
PHP实现获取并生成数据库字典的方法
2016/05/04 PHP
PHP利用正则表达式将相对路径转成绝对路径的方法示例
2017/02/28 PHP
PHP7新功能总结
2019/04/14 PHP
一些常用且实用的原生JavaScript函数
2010/09/08 Javascript
javascript操作css属性
2013/12/30 Javascript
jquery 字符串切割函数substring的用法说明
2014/02/11 Javascript
表单提交前触发函数返回true表单才会提交
2014/03/11 Javascript
JavaScript中的值类型转换介绍
2014/12/31 Javascript
每天一篇javascript学习小结(Array数组)
2015/11/11 Javascript
jquery mobile界面数据刷新的实现方法
2016/05/28 Javascript
基于webpack-hot-middleware热加载相关错误的解决方法
2018/02/22 Javascript
使用jquery DataTable和ajax向页面显示数据列表的方法
2018/08/09 jQuery
怎么理解wx.navigateTo的events参数使用详情
2020/05/18 Javascript
keep-Alive搭配vue-router实现缓存页面效果的示例代码
2020/06/24 Javascript
[54:10]Spirit vs NB Supermajor小组赛 A组败者组决赛 BO3 第一场 6.2
2018/06/03 DOTA
Python语言实现机器学习的K-近邻算法
2015/06/11 Python
Python实现感知器模型、两层神经网络
2017/12/19 Python
Python装饰器用法示例小结
2018/02/11 Python
Python实现的爬虫刷回复功能示例
2018/06/07 Python
Python函数定义及传参方式详解(4种)
2019/03/18 Python
使用python爬取微博数据打造一颗“心”
2019/06/28 Python
Python何时应该使用Lambda函数
2019/07/02 Python
超全Python图像处理讲解(多模块实现)
2020/04/13 Python
CSS3教程(9):设置RGB颜色
2009/04/02 HTML / CSS
基于IE10/HTML5 开发
2013/04/22 HTML / CSS
与世界上最好的跑步专业品牌合作:Fleet Feet
2019/03/22 全球购物
Paper Cape官网:美国婴儿和儿童服装品牌
2019/11/02 全球购物
static全局变量与普通的全局变量有什么区别
2014/05/27 面试题
初二政治教学反思
2014/01/12 职场文书
新学期校长寄语
2014/01/18 职场文书
见习报告格式要求
2014/11/04 职场文书
2015年销售内勤工作总结
2015/04/27 职场文书
python实现简单的井字棋
2021/05/26 Python
单机多实例部署 MySQL8.0.20
2022/05/15 MySQL