欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

使用prop解決一個checkbox選中后再次選中失效的問題

 更新時間:2017年07月05日 09:06:54   投稿:jingxian  
下面小編就為大家?guī)硪黄褂胮rop解決一個checkbox選中后再次選中失效的問題。小編覺得挺不錯的,現在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧

//問題點

初始狀態(tài)復選框沒有全選,

點擊全選按鈕調用checkAll方法,

實現了全選,

然后點擊全不選按鈕,

 

實現了全不選,

然后再次點擊全選按鈕,

結果卻木有全選,

再反復點擊木有任何反應。

demo:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
  <script src="js/jquery-1.11.3.min.js"></script>
  <script>
    $(function () {
      $("#allchoose").click(function () {
          $(":checkbox").prop("checked",true);
      })
      $("#allnochoose").click(function () {
        if ($(":checkbox").is(":checked")){
          $(":checkbox").attr("checked",false);
        }
      })
      $("#choose").click(function () {
        if($(":checkbox").is(":checked")){
          $(":checkbox").attr("checked",false);
        }else{
          $(":checkbox").prop("checked",true);
        }
      })
    })
  </script>
</head>
<body>
<input type="checkbox" name="checkbox" id="">乒乓球
<input type="checkbox" name="checkbox" id="">羽毛球
<input type="checkbox" name="checkbox" id="">足球
<input type="checkbox" name="checkbox" id="">籃球
<input type="checkbox" name="checkbox" id="">排球<br>
<input type="button" value="全選" id="allchoose">
<input type="button" value="全不選" id="allnochoose">
<input type="button" value="反選" id="choose">
<input type="submit" value="提交" id="submit">
</body>
</html>

以上這篇使用prop解決一個checkbox選中后再次選中失效的問題就是小編分享給大家的全部內容了,希望能給大家一個參考,也希望大家多多支持腳本之家。

相關文章

  • jquery彈窗時禁止body滾動條滾動的例子

    jquery彈窗時禁止body滾動條滾動的例子

    今天小編就為大家分享一篇jquery彈窗時禁止body滾動條滾動的例子,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧
    2019-09-09
  • JQuery實現樣式設置、追加、移除與切換的方法

    JQuery實現樣式設置、追加、移除與切換的方法

    這篇文章主要介紹了JQuery實現樣式設置、追加、移除與切換的方法,涉及jQuery樣式操作的常用技巧,非常簡單實用,需要的朋友可以參考下
    2015-06-06
  • jQuery實現灰藍風格標準二級下拉菜單效果代碼

    jQuery實現灰藍風格標準二級下拉菜單效果代碼

    這篇文章主要介紹了jQuery實現灰藍風格標準二級下拉菜單效果代碼,涉及jquery鼠標mouseover事件控制頁面元素樣式動態(tài)變換的實現技巧,具有一定參考借鑒價值,需要的朋友可以參考下
    2015-08-08
  • Jquery滑動門/tab切換實現方法完整示例

    Jquery滑動門/tab切換實現方法完整示例

    這篇文章主要介紹了Jquery滑動門/tab切換實現方法,結合完整實例形式分析了Jquery滑動門/tab切換具體操作技巧與頁面元素動態(tài)操作實現方法,需要的朋友可以參考下
    2020-06-06
  • jQuery事件綁定用法詳解(附bind和live的區(qū)別)

    jQuery事件綁定用法詳解(附bind和live的區(qū)別)

    這篇文章主要介紹了jQuery事件綁定用法,結合實例形式較為詳細的分析了jQuery事件綁定的實現原理與相關注意事項,并附帶了相關綁定方法的使用說明,重點介紹了bind和live的區(qū)別,需要的朋友可以參考下
    2016-01-01
  • jQuery 插件開發(fā) 其實很簡單

    jQuery 插件開發(fā) 其實很簡單

    jQuery已經被廣泛使用,憑借其簡潔的API,對DOM強大的操控性,易擴展性越來越受到web開發(fā)人員的喜愛,我在社區(qū)也發(fā)布了很多的jQuery插件
    2009-07-07
  • jQuery Chosen通用初始化

    jQuery Chosen通用初始化

    這篇文章主要介紹了jQuery Chosen通用初始化,非常不錯,具有參考借鑒價值,需要的朋友可以參考下
    2017-03-03
  • jquery實現網頁左側導航菜單欄

    jquery實現網頁左側導航菜單欄

    這篇文章主要為大家詳細介紹了jquery實現網頁左側導航菜單欄,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2022-07-07
  • jQuery復制表單元素附源碼分享效果演示

    jQuery復制表單元素附源碼分享效果演示

    當我們遇到提交表單時,需要我們重復添加好幾個表單,在訂單表格中添加多個不同型號的產品信息。這個時候有復制表單表單按鈕,也就是新增一項,通過點擊復制按鈕來實現新增一項,怎么實現的呢?下面小編跟大家分享,需要的朋友的朋友可以參考下
    2015-09-09
  • 用jquery實現自定義風格的滑動條實現代碼

    用jquery實現自定義風格的滑動條實現代碼

    用jquery實現自定義風格的滑動條的實現代碼,需要的朋友可以參考下。
    2011-04-04

最新評論