`<!DOCTYPE html>
<html>
<head>
<title>自定义插件-实现check radio 反选</title>
<meta charset="utf-8">
</head>
<body>
<script type="text/javascript" src = "jquery-2.2.3.min.js"></script>
<input type="checkbox" name="">
<input type="checkbox" name="">
<input type="radio" name="">
<input type="radio" name="">
<input type="checkbox" name="">
<input type="checkbox" name="">
<button id = "span">点击反选</button>
<script type="text/javascript">
$.fn.extend({
aa:function(ele){
//
$(this).on('click',function(){
//方法一 each 遍历,改变状态
// ele.each(function(){
// //获取 控制的check , prop 获取属性 并 赋值 为 它当前 属性值的相反值
// $(this).prop('checked',!$(this).prop('checked'));
// })
//方法二 分别操作 checkbox radio 不可以????
$("checkbox").prop("checked",!$("checkbox").prop("checked"));
$("radio").prop("checked",!$("radio").prop("checked"));
})
}
});
//调用方法一:
// 通过 id 名为 span 获取
// $('#span').aa($('input[type = checkbox],input[type = radio]'));
//调用方法二:
//通过 按钮来 调用 自定义的插件方法
$('button').aa($('input'));
</script>
</body>
</html>`
网友评论