Layui radio点击事件实现input显示和隐藏的例子
如下所示:
前端代码
<link rel="stylesheet" href="/static/index/layui/css/layui.css" rel="external nofollow" >
<script type="text/javascript" src="/static/index/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="/static/index/js/jquery-3.3.1.min.js" charset="utf-8"></script>
<form class="layui-form" action="">
<div class="layui-form-item">
<label class="layui-form-label" style="width:100px">是否已购买:</label>
<div class="layui-input-block" id="IsPurchased" >
<input type="radio" name="t" value="购买" title="购买" lay-filter="aaa"/>
<input type="radio" name="t" value="试用" title="试用" lay-filter="aaa"/>
</div>
</div>
<div class="layui-form-item count">
<label class="layui-form-label">试用次数:</label>
<div class="layui-input-inline">
<input type="text" id="ProbationAccount" required="required" placeholder="请输入试用次数" autocomplete="off" class="layui-input" />
</div>
<div class="layui-form-mid layui-word-aux"></div>
</div>
</form>
<script>
layui.use('form', function () {
var form = layui.form;
form.on('radio(aaa)', function (data) {
if ($('#IsPurchased input[name="t"]:checked ').val() == "购买") {
$(".count").hide();
}
else {
$(".count").show();
}
form.render();
});
});
</script>
(资源库 www.zyku.net)
您可能感兴趣的文章
- 03-17帝国CMS提示页使用Layui弹出框消息提示信息
- 03-16帝国CMS在内容页面直接显示评论
- 03-16帝国CMS内容页评论显示会员头像
- 09-13如何隐藏CNZZ“站长统计”字样
- 09-07win10网页打开图片很慢且无法显示怎么解决
- 09-07javaScript实现世界各地时间显示
- 06-26jquery 显示隐藏input输入框
- 06-24SyntaxHighlighter 隐藏Y轴滚动条
- 05-10Win10如何设置双屏显示器?Win10双屏显示器设置步骤
- 04-17帝国CMS灵动标签显示标题属性、截取标题字数
- 05-16DeDecms文章列表每一行不一样的方法
- 01-11闪电匣-闪电匣应用软件功能介绍
- 09-14雅迪乐骑plus如何绑定手机
- 10-29抖音作品仅自己可见方法介绍
- 01-11育财师通-育财师通应用软件功能介绍
- 10-09lofter怎么开通打赏功能
- 01-12小方糖S1-小方糖S1应用软件功能介绍
- 01-18CT影视app-CT影视app应用软件功能介绍
- 07-05Linux apachectl命令
- 01-19绯闻语音-绯闻语音应用软件功能介绍
最近更新
阅读排行
猜你喜欢
- 12-30骨科医院挂号网-骨科医院挂号网应用软
- 02-26帝国CMS功能解密之:标签实现复杂调用更
- 09-18百度搜索相关API
- 07-05Linux tcpdump命令
- 11-08QQ音乐互动歌单功能介绍
- 11-25vivox70pro怎么手机搬家
- 03-13纯CSS实现垂直居中的几种方法
- 02-23DedeCms时间格式汇总
- 07-15给帝国ECMS加上个腾讯微博一键转播功
- 04-27小米11广角模式设置教程