返回顶部
首页 > 资讯 > 前端开发 > html >layui下拉列表中change事件怎么用
  • 780
分享到

layui下拉列表中change事件怎么用

2024-04-02 19:04:59 780人浏览 八月长安
摘要

这篇文章将为大家详细讲解有关layui下拉列表中change事件怎么用,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。默认情况下,事件所监听的是全部的fORM模块元素,但如

这篇文章将为大家详细讲解有关layui下拉列表中change事件怎么用,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。

默认情况下,事件所监听的是全部的fORM模块元素,但如果你只想监听某一个元素,使用事件过滤器即可。

如:<select lay-filter="test"></select>

监听select

下拉选择框被选中时触发,回调函数返回一个object参数,携带两个成员:

注意:form.render('select');渲染一下 不然你的操作还是不生效 select不是选择器 表示渲染下拉列表 不写表示所有表单都渲染

语法如下

form.on('select(filter)', function(data){
console.log(data.elem); //得到select原始DOM对象
console.log(data.value); //得到被选中的值
console.log(data.othis); //得到美化后的DOM对象
});
form.on('select(search_type)', function(data){
  var html_one='<option value="1">充值</option><option value="2">还本付息</option>';
  if(data.value == 1){
    $("#search_detail").html(html_one);
    form.render('select');
  }else if(data.value == 2){
    var html_two='<option value="3">提现</option><option value="4">购买产品</option>';
    $("#search_detail").html(html_two);
    form.render('select');//select是固定写法 不是选择器
  }

});

上图的search_type就是下拉列表的lat-filter参数的值

lay-filter="search_type"

layui下拉列表中change事件怎么用

关于“layui下拉列表中change事件怎么用”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,使各位可以学到更多知识,如果觉得文章不错,请把它分享出去让更多的人看到。

--结束END--

本文标题: layui下拉列表中change事件怎么用

本文链接: https://lsjlt.com/news/78667.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

猜你喜欢
  • layui下拉列表中change事件怎么用
    这篇文章将为大家详细讲解有关layui下拉列表中change事件怎么用,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。默认情况下,事件所监听的是全部的form模块元素,但如...
    99+
    2024-04-02
  • layui中select下拉change事件失效怎么办
    这篇文章主要介绍layui中select下拉change事件失效怎么办,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!layui 中select下拉change事件失效的处理方法1.s...
    99+
    2024-04-02
  • layui导航栏不展示下拉列表怎么办
    这篇文章主要介绍layui导航栏不展示下拉列表怎么办,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!在使用导航栏时下拉列表不展示没有下拉效果是这样的经过修改后就解决了:具体原因是没有导...
    99+
    2024-04-02
  • angularjs如何实现下拉列表的选中事件
    这篇文章主要介绍了angularjs如何实现下拉列表的选中事件,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。select标签的对于大家来说很...
    99+
    2024-04-02
  • Bootstrap中的下拉列表select怎么用
    小编给大家分享一下Bootstrap中的下拉列表select怎么用,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!前提条件当然了这...
    99+
    2024-04-02
  • android下拉列表怎么做
    要在Android应用中实现下拉列表,可以使用 Spinner 控件。Spinner 是一个下拉列表,用户可以从中选择一个选项。 以...
    99+
    2024-03-04
    android
  • VUE使用ElementUI下拉框@change事件数据不回显怎么解决
    这篇文章主要介绍了VUE使用ElementUI下拉框@change事件数据不回显怎么解决的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇VUE使用ElementUI下拉框@change事件数据不回显怎么解决文章都...
    99+
    2023-07-05
  • Javascript中怎么操作select下拉列表
    本篇文章给大家分享的是有关Javascript中怎么操作select下拉列表,小编觉得挺实用的,因此分享给大家学习,希望大家阅读完这篇文章后可以有所收获,话不多说,跟着小编一起来看看吧。Javascript...
    99+
    2024-04-02
  • vue下拉列表怎么实现
    小编给大家分享一下vue下拉列表怎么实现,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!vue下拉列表的两种实现第一种采用v-for的方式  &...
    99+
    2023-06-15
  • Excel怎么制作下拉列表
    在Excel中制作下拉列表,可以按照以下步骤进行操作:1. 在一个单元格中输入下拉列表的选项,每个选项占一行。2. 选中一个单元格,...
    99+
    2023-09-15
    excel
  • excel下拉列表怎么删除
    本篇内容介绍了“excel下拉列表怎么删除”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!excel下拉列表删除方法:首先进入表格,然后选择下...
    99+
    2023-07-02
  • excel下拉列表怎么设置
    这篇文章主要讲解了“excel下拉列表怎么设置”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“excel下拉列表怎么设置”吧!excel下拉列表设置方法:首先打开excel表格,然后找到需要设...
    99+
    2023-07-02
  • VUE使用ElementUI下拉框@change事件数据不回显问题
    目录使用ElementUI下拉框 @change事件数据不回显问题解决方案VUE下拉框数据及数据回显问题总结使用ElementUI下拉框 @change事件数据不回显 问题 在VUE...
    99+
    2023-02-23
    VUE使用ElementUI下拉框 @change事件数据不回显 VUE ElementUI下拉框
  • ASP.NET中DropDownList下拉框列表控件怎么绑定数据
    在ASP.NET中,可以通过以下步骤来绑定数据到DropDownList下拉框列表控件: 在前端页面(.aspx文件)中...
    99+
    2024-03-02
    ASP.NET
  • layui表单验证select下拉框怎么实现验证
    这篇文章主要介绍layui表单验证select下拉框怎么实现验证,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!layui 的form表单里的select 一开始以为加上lay-ver...
    99+
    2024-04-02
  • html下拉列表框怎么设置
    HTML下拉列表框是web页面中常用的交互元素之一,可以让用户选择一个或多个预定义的选项。在本文中,我们将介绍如何设置HTML下拉列表框,包括创建下拉列表框、添加选项、设置默认选项等。1.创建下拉列表框使用HTML下拉列表框的第一步是创建一...
    99+
    2023-05-14
  • 使用layui怎么按条件隐藏表格列
    使用layui怎么按条件隐藏表格列,针对这个问题,这篇文章详细介绍了相对应的分析和解答,希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。layui.use(['table',&#...
    99+
    2024-04-02
  • 使用layui监听器监听select下拉框,事件绑定不成功怎么办
    这篇文章主要为大家展示了“使用layui监听器监听select下拉框,事件绑定不成功怎么办”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“使用layui监听器监听...
    99+
    2024-04-02
  • jquery下拉列表选中的值怎么获取
    可以通过以下方式获取jquery下拉列表选中的值:1. 使用.val()方法获取选中的值:```var selectedValue ...
    99+
    2023-05-29
    jquery下拉列表 jquery
  • java怎么获取下拉列表选中的值
    在Java中获取下拉列表(ComboBox)选中的值,可以通过以下步骤实现: 获取下拉列表对象: JComboBox combo...
    99+
    2024-03-06
    java
软考高级职称资格查询
推荐阅读
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作