JQuery 判斷checkbox是否被選中
<input type="checkbox" id="cbShowCreditPage" />show! if ($("#cbNotShowCreditPage").attr("checked") == "checked") { .... }
替CheckBox增加Value值
<asp:CheckBox runat="server" ID="Test" Text="Test"/>
沒有value屬性，在CodeBehind使用InputAttributes:
Test.InputAttributes["value"] = "123";
// ========================================================
// jquery如何判断checkbox（复选框）是否被选中
// ========================================================
參考: http://blog.chinaunix.net/uid-16480950-id-103026.html
一、如何判断一个checkbox是否选择上？
if($("#aa").attr("checked")==true) { alert("此checkbox勾选择上"); }
二、 常用的操作请看整理的代码
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//ZH-CN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html"> <script type="text/javascript" src="jquery-1.3.2.min.js"></script> <SCRIPT LANGUAGE="JavaScript"> $("document").ready(function(){ $("#btn1").click(function(){ $("[name='checkbox']").attr("checked",'true');//全选 }) $("#btn2").click(function(){ $("[name='checkbox']").removeAttr("checked");//取消全选 }) $("#btn3").click(function(){ $("[name='checkbox']:even").attr("checked",'true');//选中所有奇数 }) $("#btn4").click(function(){ $("[name='checkbox']").each(function() { if($(this).attr("checked")) { $(this).removeAttr("checked"); } else { $(this).attr("checked",'true'); } }) }) $("#btn5").click(function(){ var str=""; $("[name='checkbox'][checked]").each(function(){ str+=$(this).val()+"\n"; }) alert(str); }) }) </script> </head> <BODY> <form name="form1" method="post" action=""> <input type="button" id="btn1" value="全选"> <input type="button" id="btn2" value="取消全选"> <input type="button" id="btn3" value="选中所有奇数"> <input type="button" id="btn4" value="反选"> <input type="button" id="btn5" value="获得选中的所有值"> <br> <input type="checkbox" name="checkbox" value="checkbox1" id="aa"> checkbox1 <input type="checkbox" name="checkbox" value="checkbox2"> checkbox2 <input type="checkbox" name="checkbox" value="checkbox3"> checkbox3 <input type="checkbox" name="checkbox" value="checkbox4"> checkbox4 <input type="checkbox" name="checkbox" value="checkbox5"> checkbox5 <input type="checkbox" name="checkbox" value="checkbox6"> checkbox6 <input type="checkbox" name="checkbox" value="checkbox7"> checkbox7 <input type="checkbox" name="checkbox" value="checkbox8"> checkbox8 </form> </body> </html>
非常方便！
----------------版本02补充
JQuery 获取checkbox的值然后 ajax提交
//服务器列表 var str=""; $("[name='host[]'][checked]").each(function(){ str+=$(this).val()+"\n"; }) if(str == "") { alert("请选择服务器"); return; } var selectedItems = new Array(); $("input[@name='host[]']:checked").each(function() {selectedItems.push($(this).val());}); if (selectedItems .length == 0) { alert("Please select item(s) to delete."); } var host = selectedItems.join('|'); $.ajax({ url: 'http://192.168.0.103/src/sshtest.php', type: 'post', async: false, //如果服务器要开一个exec记得加这个参数值。要不然返回http 0！ dataType: 'text', data:{"idc":idcname,"host":host}, timeout: 1000, error: function(){ alert('Error loading XML document'); $("#uploadresult").html(""); }, success: function(xml){ $("#uploadresult").show(); $("#upload").toggle(); $("#uploadresult").html(xml); } });
然后服务器获取：
$res=explode("|",$host);
for($i=0;$i<count($res);$i++) {
$cmd = $cmd . " --host " . $res[$i]." ";
}
就行了！
===========================补充一段AJAX==========================================
<input class="classinfo" type="checkbox" id="class<?php echo $value['id'];?>" checked value="<?php echo $value['id'];?>">
$("document").ready(function(){
$(".classinfo").click(function(){
var self = this; //闭包的一些概念!
var obj = this;
if (obj.checked == true) {
//表示要对它进行配置了
} else {
if(window.confirm("你确定要将此类移除?")) {
//通过ajax将这个类的属性配置删除掉
var classid = obj.value;
var hostgroupid = $("#groupid").val();
$.ajax({
type:"GET",
url: "?a=puppet&m=hostgroupclassdel&classid="+classid+"&hostgroupid="+hostgroupid+"&num="+Math.random(),
dataType: 'text',
success:function(msg){
if(msg=='1') {
alert("OK");
$(self).attr("disabled","disabled");
} else {
alert("DOWN");
}
}
})
}else {
$(this).attr("checked",true); //如果用户不选择
}
}
});
// =======================================================
// [jQuery]判斷 checkbox 是否選取，實現全選跟全部取消
// =======================================================
參考: http://blog.wu-boy.com/2008/12/jquery%E5%88%A4%E6%96%B7-checkbox-%E6%98%AF%E5%90%A6%E9%81%B8%E5%8F%96%EF%BC%8C%E5%AF%A6%E7%8F%BE%E5%85%A8%E9%81%B8%E8%B7%9F%E5%85%A8%E9%83%A8%E5%8F%96%E6%B6%88/
update 2009.05.13: jQuery 1.3 版之後不支援
$("input[@name='user_active_col[]']")
請改寫成
$("input[name='user_active_col[]']")
在 jQuery 底下要如何實現這個功能，其實還蠻簡單的，首先看 html 部份
<input name="user_active_col[]" type="checkbox" value="1"> 1 <input name="user_active_col[]" type="checkbox" value="2"> 2 <input name="user_active_col[]" type="checkbox" value="3"> 3 <input name="user_active_col[]" type="checkbox" value="4"> 4 <input name="user_active_col[]" type="checkbox" value="5"> 5 <input name="clickAll" id="clickAll" type="checkbox"> 全選
jQuery 部份如下：
$("#clickAll").click(function() {
if($("#clickAll").attr("checked"))
{
$("input[name='user_active_col[]']").each(function() {
$(this).attr("checked", true);
});
}
else
{
$("input[name='user_active_col[]']").each(function() {
$(this).attr("checked", false);
});
}
});
這樣就可以了
浙公网安备 33010602011771号