jquery attr方法獲取input的checked屬性問題
更新時間:2014年05月26日 09:58:21 作者:
如果使用jquery,應使用prop方法來獲取和設置checked屬性,不應使用attr,需要的朋友可以參考下
問題:經常使用jQuery插件的attr方法獲取checked屬性值,獲取的值的大小為未定義,此時可以用prop方法獲取其真實值,下面介紹這兩種方法的區(qū)別:
1.通過prop方法獲取checked屬性,獲取的checked返回值為boolean,選中為true,否則為flase
<input type="checkbox" id="selectAll" onclick="checkAll()">全選
function checkAll()
{
var checkedOfAll=$("#selectAll").prop("checked");
alert(checkedOfAll);
$("input[name='procheck']").prop("checked", checkedOfAll);
}
2.如果使用attr方法獲取時,如果當前input中初始化未定義checked屬性,則不管當前是否選中,$("#selectAll").attr("checked")都會返回undefined;
<input type="checkbox" id="selectAll" onclick="checkAll()" >全選
如果當前input中初始化已定義checked屬性,則不管是否選中,$("#selectAll").attr("checked")都會返回checked.
<input type="checkbox" id="selectAll" onclick="checkAll()" checked>全選
function checkAll()
{
var checkedOfAll=$("#selectAll").attr("checked");
alert(checkedOfAll);
$("input[name='procheck']").attr("checked", checkedOfAll);
}
總結,如果使用jquery,應使用prop方法來獲取和設置checked屬性,不應使用attr.
1.通過prop方法獲取checked屬性,獲取的checked返回值為boolean,選中為true,否則為flase
復制代碼 代碼如下:
<input type="checkbox" id="selectAll" onclick="checkAll()">全選
function checkAll()
{
var checkedOfAll=$("#selectAll").prop("checked");
alert(checkedOfAll);
$("input[name='procheck']").prop("checked", checkedOfAll);
}
2.如果使用attr方法獲取時,如果當前input中初始化未定義checked屬性,則不管當前是否選中,$("#selectAll").attr("checked")都會返回undefined;
復制代碼 代碼如下:
<input type="checkbox" id="selectAll" onclick="checkAll()" >全選
如果當前input中初始化已定義checked屬性,則不管是否選中,$("#selectAll").attr("checked")都會返回checked.
復制代碼 代碼如下:
<input type="checkbox" id="selectAll" onclick="checkAll()" checked>全選
function checkAll()
{
var checkedOfAll=$("#selectAll").attr("checked");
alert(checkedOfAll);
$("input[name='procheck']").attr("checked", checkedOfAll);
}
總結,如果使用jquery,應使用prop方法來獲取和設置checked屬性,不應使用attr.
相關文章
jQuery實現Table表格隔行變色及高亮顯示當前選擇行效果示例
這篇文章主要介紹了jQuery實現Table表格隔行變色及高亮顯示當前選擇行效果,涉及jQuery針對table元素遍歷、運算、樣式及鼠標事件動態(tài)響應相關操作技巧,需要的朋友可以參考下2017-02-02分享2個jQuery插件--jquery.fileupload與artdialog
這篇文章主要介紹了分享2個jQuery插件--jquery.fileupload與artdialog的使用方法及示例,非常的實用,這里推薦給大家。2014-12-12jquery.tableSort.js表格排序插件使用方法詳解
這篇文章主要為大家詳細介紹了jquery.tableSort.js表格排序插件使用方法,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下2017-02-02