jQuery编程基础精华03（RadioButton操作，事件，⿏标）RadioButton操作
取得RadioButton的选中值，被选中的radio只有⼀个值，所以直接⽤val()
$('#btn1').click(function () {
$(':radio:checked').each(function () {//遍历，因为只能获取⼀个
alert($(this).val());
});
});
$('#btn2').click(function () {
//$(':radio[value=f]').attr('checked',true);
$(':radio').val(['m','a']);//checkbox select都可以这么做
});
设置RadioButton的选中值：.attr(‘checked’,true);
$("input[name=gender]").val(["⼥"]);
或者
$(":radio[name=gender]").val(["⼥"]);
注意val中参数的[]不能省略,val()的参数必须是⼀个数组。
RadioButton操作2
对RadioButton的选择技巧对于CheckBox和Select列表框也适⽤
除了可以使⽤val批量设置RadioButton、CheckBox等的选中以外，还可以设定checked属性来单独设置控件的选中状态
$(‘#selOne’).val([‘1’,’2’,’3’]);//同时设置多个下拉菜单选中
$("#btn1").attr("checked",true)
=======================练习：CheckBox的全选、全不选、反选======================
$('#b1').click(function () {
$('div :checkbox').attr('checked', true);
});
$('#b2').click(function () {
$('div :checkbox').attr('checked', false);
});
$('#b3').click(function () {
$('div :checkbox').each(function () {
$(this).attr('checked', !$(this).attr('checked'));
});
});
事件
jQuery中的事件绑定：$("#btn").bind("click",function(){})，每次都这么调⽤太⿇烦，所以jQuery可以⽤$("#btn").click(function(){})来进⾏简化
事件冒泡
事件冒泡：jQuery中也像JavaScript⼀样是事件冒泡window.event.cancelBubble = true,ie取消jquery的attr属性
如果想获得事件相关的信息，只要给响应的匿名函数增加⼀个参数：e，e就是事件对象。调⽤事件对象的stopPropagation()⽅法终⽌冒泡。e. stopPropagation();
标准js⽅式：e.stopPropagation();
IE下：e.cancelBubble = true；
$("tr").click(function(e) { alert("tr被点击"); e.stopPropagation(); });//注意函数的参数是e
阻⽌事件
阻⽌默认⾏为：有的元素有默认⾏为，⽐如超链接点击后会转向新链接、提交按钮默认会提交表单，
如果想阻⽌默认⾏为只要调⽤事件对象的preventDefault()⽅法和urnValue=false效果⼀样。
$(“a”).click(function(e) { alert(“所有超链接暂时全部禁⽌点击”); e.preventDefault(); });//jQuery中封装的。
（*）
jQuery在注册事件的时候如何传递参数？event.data获取参数。
.click({‘k’:1,’v’:2},fn)；然后通过evt.data.k或evt.data.v
.bind(‘click’,data,fn);//同上
事件其他（*）
jQuery的事件对象：event对象。
属性：pageX、pageY、target获得触发事件的元素(冒泡的起始，和this不⼀样，相当于window.event.srcElement)、which如果是⿏标事件获得按键（1左键，2
中键，3右键），如果是键盘事件keydown则获取的是keyCode。
$(this).offset()//获取当前元素相对于页⾯的坐标。
$(this).offset().left、$(this).offset().top
⿏标
动画
show()、hide()⽅法会显⽰、隐藏元素。⽤toggle(speed)⽅法在显⽰、隐藏之间切换
$(":button[value=show]").click(function() { $("div").show(); });
$(":button[value=hide]").click(function() { $("div").hide(); });
如果show、hide⽅法不带参数则是⽴即显⽰、⽴即隐藏，如果指定速度参数则会⽤指定时间进⾏动态显⽰、隐藏，单位为毫秒，也可以使⽤三个内置的速度：fast（200毫秒）、normal（400毫秒）、slow（600毫秒），jQuery动画函数中需要速度的地⽅⼀般也可以使⽤这个三个值。
获得发⽣事件时⿏标的位置
$(document).mousemove(function(e) {
document.title = e.pageX + "," + e.pageY;
});
在mousemove、click等事件的匿名响应函数中如果指定⼀个参数e，那么就可以从e读取发⽣事件时的⼀些信息，⽐如对mousemove等⿏标事件来说，就可以读取e.pageX、e.pageY来获得发⽣事件时⿏标在页⾯的坐标。
练习2：跟着⿏标⾛的⽂字（⼩天使）
<script type="text/javascript">
$(document).mousemove(function(e) {
$("#tips1").css("top",e.pageY+20).css("left",e.pageX);
});
</script>
<div id="tips1" >跟着你</div>
$(document)表⽰整个浏览器页⾯窗⼝，$(body)仅表⽰可⽤范围。
滑动效果
•slideDown()、slideUp()、slideToggle()隐藏就显⽰，显⽰就隐藏
淡⼊淡出（透明）
•fadeIn()、fadeOut()、fadeToggle()同上、fadeTo()到达透明度多少2000，0.1
注意
id和jQuery对象的区别。动态创建出来的对象在append之前是不能通过$("#id")来引⽤的。
js中单引号与双引号
$(‘body’).append($(‘<table></table>’)).append($(‘<a></a>’));//a在body中，不在table中。
stopPropagation();//阻⽌事件冒泡

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。