解决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 EasyUI的formatter格式化函数代码
Jan 12 Javascript
原始的js代码和jquery对比体会
Sep 10 Javascript
js function定义函数的几种不错方法
Feb 27 Javascript
如何设置一定时间内只能发送一次请求
Feb 28 Javascript
jQuery性能优化技巧分析
Feb 20 Javascript
限制文本框只能输入数字||只能是数字和小数点||只能是整数和浮点数
May 27 Javascript
jQuery基于BootStrap样式实现无限极地区联动
Aug 26 Javascript
js 性能优化之快速响应的用户界面
Feb 15 Javascript
JavaScript实现实时更新系统时间的实例代码
Apr 04 Javascript
js核心基础之闭包的应用实例分析
May 11 Javascript
uniapp 仿微信的右边下拉选择弹出框的实现代码
Jul 12 Javascript
Swiper实现导航栏滚动效果
Oct 16 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
双料怀旧--SHARP GF515的维护、修理和简单调试
2021/03/02 无线电
VML绘图板②脚本--VMLgraph.js、XMLtool.js
2006/10/09 PHP
PHP入门
2006/10/09 PHP
php 不同编码下的字符串长度区分
2009/09/26 PHP
PHP+JS实现的商品秒杀倒计时用法示例
2016/11/15 PHP
PHP根据树的前序遍历和中序遍历构造树并输出后序遍历的方法
2017/11/10 PHP
Cookie跨域问题解决方案代码示例
2020/11/24 PHP
javascript 面向对象思想 附源码
2009/07/07 Javascript
JavaScript高级程序设计 阅读笔记(十四) js继承机制的实现
2012/08/14 Javascript
基于JavaScript 声明全局变量的三种方式详解
2013/05/07 Javascript
JS获取键盘上任意按键的值(实例代码)
2013/11/12 Javascript
javascript ajax的5种状态介绍
2014/08/18 Javascript
jquery实现个人中心导航菜单效果和美观都非常不错
2014/09/02 Javascript
自定义jQuery插件方式实现强制对象重绘的方法
2015/03/23 Javascript
jQuery mobile转换url地址及获取url中目录部分的方法
2015/12/04 Javascript
Kendo Grid editing 自定义验证报错提示的解决方法
2016/11/18 Javascript
微信小程序 开发之滑块视图容器(swiper)详解及实例代码
2017/02/22 Javascript
vue2.0数据双向绑定与表单bootstrap+vue组件
2017/02/27 Javascript
深入理解Node中的buffer模块
2017/06/03 Javascript
详解Vuex中mapState的具体用法
2017/09/28 Javascript
基于js文件加载优化(详解)
2018/01/03 Javascript
浅析vue深复制
2018/01/29 Javascript
微信小程序事件流原理解析
2019/11/27 Javascript
JavaScript实现世界各地时间显示
2020/09/07 Javascript
vue 使用class创建和清除水印的示例代码
2020/12/25 Vue.js
python进阶教程之词典、字典、dict
2014/08/29 Python
django model去掉unique_together报错的解决方案
2016/10/18 Python
利用Python爬取微博数据生成词云图片实例代码
2017/08/31 Python
解决python3捕获cx_oracle抛出的异常错误问题
2018/10/18 Python
django开发post接口简单案例,获取参数值的方法
2018/12/11 Python
html5中valid、invalid、required的定义
2014/02/21 HTML / CSS
美国顶级防滑鞋:Shoes For Crews
2017/03/27 全球购物
高中毕业生登记表自我鉴定范文
2014/03/18 职场文书
爱护草坪标语
2014/06/24 职场文书
《鲸》教学反思
2016/02/23 职场文书
离婚协议书范本(2016最新版)
2016/03/18 职场文书