取消選中複選框並單擊按鈕時隱藏父項

我編寫的以下代碼應該有一行復選框，選中時，將在單獨的div中顯示該複選框的標籤。取消選中複選框並單擊按鈕時隱藏父項

 <div class="span3" id="bill"> 
      <label class="checkbox"> 
      <input type="checkbox" value="" id="item1" checked="checked"> 
      Item1 - Price 
      </label> 
      <label class="checkbox"> 
      <input type="checkbox" value="" id="item2" checked="checked"> 
      Item2 - Price 
      </label> 
     </div> 
     <div class="span3" id="currBill"> 
      <label id="item1_lb"> 
      Item1 - Price 
      </label> 
      <label id="item2_lb"> 
      Item2 - Price 
      </label> 
     </div> 
     </div> 
     <div class="row-fluid"> 
     <button class="btn" id="pay">Pay</button> 
     </div>

以下JS需要選擇時顯示標籤的護理/未選中的（這是馬虎了才知道，所有複選框將稍後從數據庫中填寫，這只是一般的想法有些地方抱着代碼我的問題。）

這兩個函數都沒有工作，點擊功能至少觸發，但實際上並沒有隱藏任何東西。有任何想法嗎？

$(function() { 
    $('input:checkbox').bind('change',(function() { 
    $('#'+ithis.id+'_lb').toggle($(this).is(':checked')); 
    }); 

    $("#pay").click(function() { 
    $("#bill input[type=checkbox]").each(function() { 
     if($(this).checked) 
     { 
     $(this).parent().hide(); 
     $(this).checked = false; 
     } 
    }); 
    }); 
});

來源

2013-02-23 dk.win

您應該使用瀏覽器控制檯檢查錯誤（按Ctrl+Shift+J）。您有以下錯誤：

在第2行('change',(function()，在function關鍵字之前刪除括號。
ithis.id應該是this.id。
相反檢查if($(this).checked)應該是像你這樣第一：if($(this).is(':checked'))
要取消選中該複選框使用$(this).prop('checked', false);

小提琴這裏：http://jsfiddle.net/qKPGd/

來源

2013-02-23 00:25:24

謝謝！看起來，簡單地取消選中第二個函數中的複選框不會觸發第一個應該隱藏輔助標籤的函數，應該如何處理？我可以重複一行代碼我想，但這似乎不正確。 – 2013-02-23 00:41:34

@ dk.win：重複1行沒有問題，如果超過2或3，則爲此構建一個函數，如下所示：http://jsfiddle.net/qKPGd/1/ – 2013-02-23 00:53:31

$(this).checked試圖訪問一個jQuery集合屬性checked。您可以通過.prop方法更改元素屬性。

if ($(this).prop('checked')) { 
    ... 
    $(this).prop('checked', false);

來源

2013-02-23 00:11:14

謝謝，我的品牌新的網頁開發和有這麼多來接。 – 2013-02-23 00:35:56

取消選中複選框並單擊按鈕時隱藏父項

回答

相關問題