下载安卓APP箭头
箭头给我发消息

客服QQ:3315713922

web前端:layui 获取radio单选框选中的值

作者:sirdong     来源: https://www.cnblogs.com/sirdong/p/11757218.html点击数:3642发布时间: 2020-03-10 10:21:19

标签: HtmlCSS开发

Web开发

  layui,是一款采用自身模块规范编写的前端UI框架,遵循原生Html/CSS/JS的书写与组织形式,门槛极低,拿来即用。其外在极简,却又不失饱满的内在,体积轻盈,组件丰盈,从核心代码到API的每一处细节都经过精心雕琢,非常适合界面的快速开发

  Layui获取radio的值,layui判断radio选中的单选值

  layuiform表单获取radio选中的值

  首先准备两个radio

  <inputtype="radio"name="sex"value="1"title="男"lay-filter="ChoiceRadio">

  <inputtype="radio"name="sex"value="2"title="女"checkedlay-filter="ChoiceRadio">

  一、jq获取

  通过radio的name,id,class选择器,这里仅举例name。

  $('input[name="sex"]:checked').val();

  二、监听radio单选

  radio单选框被点击时触发,回调函数返回一个object参数,携带两个成员:

  form.on('radio(filter)',function(data){

  console.log(data.elem);//得到radio原始DOM对象

  console.log(data.value);//被点击的radio的value值

  });

  用这种方式要注意html的radio元素要设置lay-filter属性,并且与监听radio单选的filter保持一致,否则无法取到正确的值。

  layui判断radio选中的单选值

  模板引擎-layui.laytpl

  <scriptid="tpl"type="text/html">

  <inputtype="radio"name="sex"value="男"title="男"{{d.sex==1?'checked':''}}lay-filter="ChoiceRadio">

  <inputtype="radio"name="sex"value="女"title="女"{{d.sex==2?'checked':''}}lay-filter="ChoiceRadio">

  </script>

  layui的元素由以下组成:布局(栅格、后台布局)、颜色、字体图标、动画、按钮、表单、导航条、面包屑、选项卡、进度条、面板、静态表格、徽章、时间线、辅助元素等。

赞(15)
踩(0)
分享到:
华为认证网络工程师 HCIE直播课视频教程