jquery radio checkbox

最新推荐文章于 2022-02-18 11:25:53 发布

最新推荐文章于 2022-02-18 11:25:53 发布 · 68 阅读

文章标签：

#jQuery #JavaScript #F# #ViewUI

本文通过一个具体的代码示例介绍了如何使用jQuery来操作HTML表单元素，包括复选框和单选按钮的选中状态改变事件，展示了如何通过JavaScript获取用户的输入并作出响应。

直接代码片段。。。

<form id="check_form">
<input name="chkAll" type="checkbox" id="chkAll" value="-1" />
<br />
<input name="pks" type="checkbox" id="" value="1" />
<input name="pks" type="checkbox" id="" value="2" />
<input name="pks" type="checkbox" id="" value="3" />
<input name="pks" type="checkbox" id="" value="4" />
<input name="pks" type="checkbox" id="" value="5" />
<input name="pks2" type="checkbox" id="" value="6" />
<input name="pks1" type="checkbox" id="" value="7" />
<hr />
<br />
<input name="ras" type="radio" id="" value="2" />
<input name="ras" type="radio" id="" value="1" />
<input name="ras" type="radio" id="" value="3" checked="checked" />
<input name="ras" type="radio" id="" value="4" />
<input name="ras" type="radio" id="" value="5" />
<input name="ras" type="radio" id="" value="6" />
<input name="ras" type="radio" id="" value="7" />
</form>
<script type="text/javascript" src="${ctx}/commons/scripts/jquery.js"></script>
<script type="text/javascript" src="${ctx}/commons/scripts/calendar.js"></script>
<script type="text/javascript" src="${ctx}/commons/scripts/cs.js"></script>
<script type="text/javascript" src="${ctx}/commons/scripts/rowEffect.js"></script>
<script type="text/javascript">//<![CDATA[
$(document).ready(function(){
var f = document.forms[0];
$("#chkAll").click( function () {
alert("hao"+$("#chkAll").val());
//$("input[name='pks']").attr("checked",$("#chkAll").attr("checked"));//正确
$(":checkbox[name='pks']").attr("checked",$("#chkAll").attr("checked"));//正确
});
});

$(":radio").click( function () {
var v = $("input[type='radio']:checked").val();
alert(v);
alert($("input[type='radio'][value=2]").attr("checked")==true);//attr返回的是个对象true不是字符串"true"
});
//]]></script>