jquery全选+下拉+单选+事件+挂事件
1.全选
<body>
<input type="checkbox" id="qx" /> 全选
<input type="checkbox" value="01" class="ck" />
<input type="checkbox" value="02" class="ck" />
<input type="checkbox" value="03" class="ck" />
<input type="checkbox" value="04" class="ck" />
<input type="checkbox" value="05" class="ck" />
</body> <script type="text/javascript">
$("#qx").click(function(){
var xz = $(this).prop("checked");//设置($this)这个全选按钮自身的属性是"checked"
var ck = $(".ck").prop("checked",xz);//xz放入之前的prop里的属性为ture
})
</script>
2.下拉
<select id="sel">
<option value="1111">1111</option>
<option value="2222">2222</option>
<option value="3333">3333</option>
</select>
<input type="button" value="取下拉" id="b1" /> <script type="text/javascript">$("#b1").click(function(){
alert($("#sel").val());
})
</script>
3.单选
<input type="radio" value="01" class="rd" name="a"/>
<input type="radio" value="02" class="rd" name="a" />
<input type="radio" value="03" class="rd" name="a" />
<input type="radio" value="04" class="rd" name="a" />
<input type="radio" value="05" class="rd" name="a" />
<input type="button" value="取单选" id="b2" /> <script type="text/javascript">
$("#b2").click(function(){
var rd = $(".rd");
for(var i=0;i<rd.length;i++)
{
if(rd[i].checked)
{
alert(rd[i].value);
}
}
})
</script>
加事件
<style type="text/css">
.aaa{ width:150px; height:150px; background-color:#06F}
</style> <body>
<div class="aaa">111111</div>
<div class="aaa">222222</div>
<div class="aaa">333333</div>
</body> <script type="text/javascript">
$(document).ready(function(e) {
$(".aaa").click(function(){
$(".aaa").css("background-color","#06f");
$(this).css("background-color","red");
})
});
</script>
挂事件
<input type="button" value="挂事件" id="btn" />
<input type="button" value="移除事件" id="btn1" />
<div id="a" style="width:100px; height:100px">cccc</div> <script type="text/javascript">
$(document).ready(function(e) {
$("#btn").click(function(){
$("#a").bind("click",function(){
$("#a").css("background-color","red");
alert("事件");
})
})
$("#btn1").click(function(){
$("#a").unbind("click");
})
});
</script>
jquery全选+下拉+单选+事件+挂事件的更多相关文章
- 使 用 Jquery 全选+下拉+单选+事件+挂事件
先引用Jquery代码包 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http: ...
- MVC身份验证.MVC过滤器.MVC6关键字Task,Async.前端模拟表单验证,提交.自定义匿名集合.Edge导出到Excel.BootstrapTree树状菜单的全选和反选.bootstrap可搜索可多选可全选下拉框
1.MVC身份验证. 有两种方式.一个是传统的所有控制器继承自定义Control,然后再里面用MVC的过滤器拦截.所以每次网站的后台被访问时.就会先走入拦截器.进行前端和后端的验证 一个是利用(MVC ...
- 自定义Angular指令与jQuery实现的Bootstrap风格数据双向绑定的单选&多选下拉框
先说点闲话,熟悉Angular的猿们会喜欢这个插件的. 00.本末倒置 不得不承认我是一个喜欢本末倒置的人,学生时代就喜欢先把晚交的作业先做,留着马上就要交的作业不做,然后慢悠悠做完不重要的作业,卧槽 ...
- js:jquery multiSelect 多选下拉框实例
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Jquery ajax 绑定multiselect多选下拉选项,同时异步执行返回值
Jquery ajax 绑定multiselect多选下拉选项,同时异步执行获取返回值 function load(mslt_employees,belongto,mark) {//传入$(#ID) ...
- DropDownList单选与多选下拉框
一.单选DropDownList传值 1.添加界面的DropDownList显示值问题 (1)在方法内添加ViewData的方法: var ad = new UnitsRepository(); Vi ...
- js多选下拉框
1.js原生实现 1.1:引用JS文件 /*! jQuery v1.12.4 | (c) jQuery Foundation | jquery.org/license */ !function(a,b ...
- JQuery操作select下拉框
JQuery操作select下拉框 获取Select选择的Text和Value $("#select_id").change(function(){//code...}); //为 ...
- pentaho cde 自定义复选下拉框 checkbox select
pentaho 自带的component 虽多,但是当用户需要在一个表格中查看多个组别的数据时,pentaho自带的单选框就不能实现了,所以复选下拉框势在必行,实现效果如下: 实现原理是借用了jqu ...
随机推荐
- ajax请求成功后打开新窗口地址
转自:http://www.cnblogs.com/linjiqin/p/3148205.html jQuery.ajax({ "type":"post&qu ...
- Xamarin.Android提示aapt退出,代码为255
Xamarin.Android提示aapt退出,代码为255 错误信息:”aapt.exe”已退出,代码为255.出现这种问题,通常是由于该项目所使用Android SDK不完整.通过SDK Mana ...
- 我理解的 js 的观察者模式 Observable
我第一次看 四人帮 写的<设计模式>时一头雾水,现在也是,或许其是针对专业的程序员学习使用的. 通过对Ext / Backbone 源码的学习,可总结如下: 模式 - 就是对解决某一类特定 ...
- clumsy 0.1 测试工具(延迟\掉包\节流\重发\乱序\篡改)
clumsy : http://jagt.github.io/clumsy/可以模拟以下几种场景: 延迟(Lag),把数据包缓存一段时间后再发出,这样能够模拟网络延迟的状况. 掉包(Drop),随机丢 ...
- BZOJ3925: [Zjoi2015]地震后的幻想乡
Description 傲娇少女幽香是一个很萌很萌的妹子,而且她非常非常地有爱心,很喜欢为幻想乡的人们做一些自己力所能及的事情来帮助他们. 这不,幻想乡突然发生了地震,所有的道路都崩塌了.现在的首要任 ...
- [Delphi]Delphi开发的一些技巧
一.提高查询效率先进行准备查询操作: CustomerQuery.Close; if not (CustomerQuery.Prepared) then -->查询是否已准备好 Customer ...
- [转]ASP.NET会话(Session)保存模式
本文转自:http://blog.csdn.net/cityhunter172/article/details/727743 作者:寒羽枫(cityhunter172) 大家好,已有四个多月没写东东啦 ...
- github上有android开源项目
下面是一些比较好的开源项目,总共分为5大类,也许对某一些人有用,有些项目也许将来某一天对自己也有用,所以整理到此,希望对大家有帮助.首先声明非原创,这篇blog的目的是分享给那些可能需要的人. htt ...
- DS实验题 sights
算法与数据结构实验题 6.3 sights ★实验任务 美丽的小风姑娘打算去旅游散心,她走进了一座山,发现这座山有 n 个景点, 由于山路难修,所以施工队只修了最少条的路,来保证 n 个景点联通,娇弱 ...
- cURL 学习笔记与总结(4)使用 cURL 从 ftp 上下载文件与上传文件到 ftp
下载: <?php $curlobj = curl_init(); curl_setopt($curlobj, CURLOPT_URL, "ftp://192.***.*.***/文件 ...