layer的prompt弹出框,点击回车,触发确定事件的方法

做了个prompt弹出框，希望点击确定按钮的时候也能触发确定的事件，用户习惯的原因，在输入框输入框数据后，再重新拿起鼠标点击太麻烦，所以想着点击确定按钮触发事件。

layer.prompt({title: '请输入数据', formType: 1,
 // 这个是确定按钮的事件
 "success":function(){
 // 键盘事件，判断回车
 $("input.layui-layer-input").on('keydown',function(e){
  if (e.which == 13) {
  // 取输入框数据 和123456 比较
  if("123456" == $(this).val()){
  alert('你点击了回车按钮！');
  layer.close(1);
  }
     }
 });
 },
 // 点击确定按钮事件
 yes : function(){
 // 取输入框数据
 var pass =$(document.getElementsByClassName('layui-layer-input')[0]).val();
 if("123456" == pass){
  alert('你点击了确定按钮!');s
  layer.close(1);
 }
 }
 });

这个方法必须要有yes，下面一个是网上找的代码，不过不好用

layer.prompt({title: '请输入数据！', formType: 1,
 "success":function(){
 $("input.layui-layer-input").on('keydown',function(e){
 if (e.which == 13) {
  console.log(e.which);
  if("123456" == $(this).val()){
  alert('回车');
  layer.close(1);
  }
    }
 });
 }},
 function(pass, index){
 console.log(index);
 if("123456" == pass){
 alert('确定按钮');
 }
 layer.close(index);
 });

这个方法之所以不行，是因为点击确定事件后，也会调用success的回调事件，而这个事件中this是不一样的，所以 $(this).val() 会报错，所以我采用的方法是把 确定按钮的回调事件单独写出来 （yes），这样就不会导致冲突了。

以上这篇layer的prompt弹出框,点击回车,触发确定事件的方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持我们。

赞 (0)

相关推荐

  • 对layer弹出框中icon数字参数的说明介绍

    前言 icon参数为0,如下代码: layer.msg('请选择要编辑的机构', {icon: 0}); 运行结果如图: icon参数为1,如下图 icon参数为2,如下图: icon参数为3,如下图: icon参数为4,如下图: icon参数为5,如下图: icon参数为6,如下图: icon参数为7,如下图: 2. 确认框示例 //锁定机构 function lockOrg(){ var row = orgDataGrid.datagrid('getSelected'); if(row){

  • layer的prompt弹出框,点击回车,触发确定事件的方法

    做了个prompt弹出框,希望点击确定按钮的时候也能触发确定的事件,用户习惯的原因,在输入框输入框数据后,再重新拿起鼠标点击太麻烦,所以想着点击确定按钮触发事件. layer.prompt({title: '请输入数据', formType: 1, // 这个是确定按钮的事件 "success":function(){ // 键盘事件,判断回车 $("input.layui-layer-input").on('keydown',function(e){ if (e.

  • vue组件实现弹出框点击显示隐藏效果

    本文实例为大家分享了vue实现弹出框点击显示隐藏的具体代码,供大家参考,具体内容如下 效果如下图 由于我的更改密码弹出框是一个组件引用的,所以在一开始是隐藏的,这就需要在当前的页面上对弹出框组件设置v-show,但是在弹出框显示出来的时候,操作执行完后当前页面的更改按钮已经被弹出框覆盖了.所以只能在弹出页面点击取消实现关闭隐藏弹出框.这样就需要写两个点击事件,但是两个点击事件就会有冲突,需要点击两下才能使弹出框显示和隐藏.然后我就用的以下方法,希望可以帮到大家!!! 代码如下 1.在当前页面中(

  • Android解决dialog弹出时无法捕捉Activity的back事件的方法

    本文实例讲述了Android解决dialog弹出时无法捕捉Activity的back事件的方法.分享给大家供大家参考.具体分析如下: 在一些情况下,我们需要捕捉back键事件,然后在捕捉到的事件里写入我们需要进行的处理,通常可以采用下面三种办法捕捉到back事件: 1)重写onKeyDown或者onKeyUp方法 2)重写onBackPressed方法 3)重写dispatchKeyEvent方法 这三种办法有什么区别在这里不进行阐述,有兴趣的朋友可以查阅相关资料. 然而在有dialog弹出时,

  • BootStrap下的弹出框加载select2框架失败的解决方法

    bootstrap下的弹出框加载select2框架失败的解决方案如下所示: $("#modal").on("shown.bs.modal", function(){ //等待弹出框弹出后再渲染select2控件 $("#select2").select2({ //再次渲染父界面后才能够加载出来数据. dropdownParent:$("#mpu_chart"), placeholder: '请选择变量', data:mpuKe

  • layer.confirm点击第一个按钮关闭弹出框的方法

    layer.confirm弹出框,当你点击第一个按钮的时候,这个弹出层不会关闭,也是给一些小伙伴带来了一些困扰, 下面分享两个解决方案: ①可以将第一个按钮的回调函数传一个index,然后使用layer.close("index")就可以点击第一个按钮的时候关闭弹出框了,代码如下: ②第二种方法就非常的粗暴了,你可以直接在这个回调函数中写: layer.closeAll('dialog'); 也能实现点击第一个按钮的时候关闭弹出框 以上这篇layer.confirm点击第一个按钮关闭弹

  • 关于layer.js使用心得-向弹出框传值问题

    目录 layer.js使用心得-向弹出框传值 问题背景 问题描述 问题分析 layui传值的一些经验,也没怎么整理:表格渲染数据,弹出框 1.layui向表格渲染数据的格式转换 2. layui弹出框,并且在表格里选中 layer.js使用心得-向弹出框传值 问题背景 实现弹出对话框加载页面,所以我选择了独立组件layer.js. 基于layer.js组件弹出了一个新的iframe的窗口(假设name为LayerFrame,方便后面称呼),但需要从之前的页面传入参数 注:'#sayHello'元

  • layer实现关闭弹出层刷新父界面功能详解

    本文实例讲述了layer实现关闭弹出层刷新父界面功能.分享给大家供大家参考,具体如下: layer是一款近年来备受青睐的web弹层组件,她具备全方位的解决方案,致力于服务各水平段的开发人员,您的页面会轻松地拥有丰富友好的操作体验. 最近一个项目采用的是hui前端框架,他的弹出层就是用的layer插件,对于弹出层,有一个操作体验大家都知道,就是关闭弹出层,需要刷新父页面.开始写的时候,我陷入了自己的误区,在弹出层处理成功之后,我调用的是: var index = parent.layer.getF

  • python selenium 弹出框处理的实现

    弹出框有两种:页面弹出框(可定位元素能操作).Windows弹出框(不能直接定位) 一.页面弹出框 等待弹出框出现之后,定位弹出框,操作其中元素 如: driver = webdriver.Chrome() driver.get("https://www.baidu.com") driver.maximize_window() #点击百度登录按钮 driver.find_element_by_xpath('//*[@id="u1"]//a[@name="t

  • JQuery实现页面弹出框

    JQuery实现页面弹出框

    本文实例为大家分享了JQuery实现页面弹出框的具体代码,供大家参考,具体内容如下 bootstrap4里面有个模态框,点击页面中的某个按钮或者元素就会弹出一个框框: 今天尝试用JQ来实现一下,具体的思路就是: 1.在页面中创建一个div2.用JQ中的hide()和show()来控制上面的div的隐藏和显示 第一步:创建按钮,div,样式 <head>     <meta charset="UTF-8">     <title>页面弹出框</t

  • jquery弹出框的用法示例(一)

    最近做一个项目,许多功能都是关于弹出框的,以前觉得弹出框就那一种,很容易实现,但是最近真的做起这个功能了,发现会有好多自己考虑不到的问题. 比如关于一些添加,删除,修改的弹出框,当添加一些用户的时候,弹出框里要提交一些关于用户的信息,设置密码等信息,当修改的时候,根据用户的名字和id号来修改密码等等. 例子如下: 复制代码 代码如下: <ul class="tabPanel clearfix"> <li class="hover"> <

随机推荐