【前端JS】radio 可单选可点击取消选中

【【前端JS】radio 可单选可点击取消选中】的更多相关文章

【前端JS】radio 可单选可点击取消选中

普通情况下 radio 单选框仅仅能实现多选一的效果,可是一旦选择当中一个后,这个单选框就不可点击取消其选中状态了.这样的功能在某些业务环境下并不适用.有时我们既须要单选框的多选一效果.也须要复选框的可点击取消效果.为此本文提供一种 JQuery 写法. /* 1. 取消与当前控件name 相同的全部控件的选中状态 2. 选中当前控件 3. 假设当前控件在点击前是选中状态,则点击后取消其选中状态 */ $("input:radio").click(function(){ var dom…

jquery 实现单选框点击取消

<label for="1" class="z-label"> <input type="radio" class="zui-radiobox" value="" id="1" name="a"> <div class="zui-radiobox-tip"></div> <span class=…

前端之 JS 实现全选、反选、取消选中

需求制作如下可选表格,实现“全选”.“反选”.“取消”功能代码示例 <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8">  <meta http-equiv="x-ua-compatible" content="IE=edge"> &…

单个单选框radio 点击选中点击取消选中

$("input:radio").click(function(){ var domName = $(this).attr('name');//获取当前单选框控件name 属性值 var checkedState = $(this).attr('checked');//记录当前选中状态 $("input:radio[name='" + domName + "']").attr('checked',false);//1. $(this).attr(…

用js实现超链接导航菜单点击切换选中时的状态

项目中使用到点解导航切换不同的颜色,如果只是li选项卡还好办,这次用到的超链接选项卡,因为a链接每次点击都会刷新,所以浏览器记不住点击的状态,也没法切换点击状态,因为项目中有好多地方要用到,在网上找了好多,总结一下. 效果 html代码 <div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief" id="nav" > <ul class="la…

js 判断 undefined,单选以及下拉框选中状态

name = $(this).attr("title"); if(typeof(name) == 'undefined'){ alert(1); } typeof 函数 radio 被选中的值 var required100 = $(".required100:checked").val(); select 被选中的值 var required6 = $(".required6").find("option:selected"…

element-ui radio 再次点击取消选中

<el-radio-group v-model="radio2"> <el-radio @click.native.prevent="clickitem(3)" :label="3"> 备选项</el-radio> <el-radio @click.native.prevent="clickitem(6)" :label="6"> 备选项</el-rad…

jquery点击选中，再次点击取消选中

if(!$(this).hasClass("current")){ $(this).addClass("current"); }else{ $(this).removeClass("current"); }…

jquery checkbox点击选中，再点击取消选中

if(n==1){ if($("#abs1").is(':checked')){ $("#abs1").prop("checked",false); }else{ $("#abs1").prop("checked",true); show("abs1"); }…

点击盒子选中里面的单选框，并给盒子添加相应样式，美化单选框、复选框样式css用法，响应式滴

pc效果图: 移动端效果图: 代码直接上: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title>首页模板选择</title> <meta name="viewport" content="width=d…