檢查父元素上的複選框點擊

所需的功能：

當我點擊該TR內TR複選框應該得到檢查和TR應該得到強調。當我點擊複選框時，應該會發生同樣的情況。

問題：當我點擊複選框

上述功能工作完全正常。但是，當我點擊tr它只適用於第一次點擊。如果我再次點擊tr，複選框不會再被檢查。

可能是什麼問題？請幫忙。

jquery和html可以在jsfiddle鏈接上找到。但仍然以供參考是：

HTML：

<table border="1" width="100%"> 
    <tbody> 
     <tr> 
      <th colspan="4">NEW PRODUCTS FOUND</th> 
     </tr> 
     <tr> 
      <th>Shelf</th> 
      <th>Product</th> 
      <th>Corrected</th> 
     </tr> 
     <tr class="hover_row hover_row_product pr_row_1"> 
      <td>aa</td> 
      <td>sdcsd</td> 
      <td> 
       <input type="checkbox" class="product_correction" product_id="1"> 
      </td> 
     </tr> 
     <tr class="hover_row hover_row_product pr_row_2"> 
      <td>aa</td> 
      <td>sdcsdc</td> 
      <td> 
       <input type="checkbox" class="product_correction" product_id="2"> 
      </td> 
     </tr> 
     <tr class="hover_row hover_row_product pr_row_3"> 
      <td>aa</td> 
      <td>dbfgbdfgb</td> 
      <td> 
       <input type="checkbox" class="product_correction" product_id="3"> 
      </td> 
     </tr> 
    </tbody> 
</table>

JS：

/*Correction proccess*/ 
$('.hover_row_product').click(function (e) { 
    var checkbox = $(this).find(':checkbox'); 
    if ($(e.target).closest('input[type="checkbox"]').length > 0) { 
     //check box clicked 
    } else { 
     checkbox.attr('checked', !checkbox.attr('checked')); 
    } 
    $prod_id = checkbox.attr('product_id'); 
    $input_checked = 2; 
    if (checkbox.is(':checked')) { 
     $input_checked = 1; 
     $('.pr_row_' + $prod_id).addClass('corrected_row'); 
    } else { 
     $input_checked = 0; 
     $('.pr_row_' + $prod_id).removeClass('corrected_row'); 
    } 
});

來源

2013-11-10 aBhijit

工作演示http://jsfiddle.net/78qzH/或這個廁所在警報http://jsfiddle.net/HfYZe/

使用.prop而不是.attr。

另外，如果你渴望：.prop() vs .attr()

希望這會滿足您的需求！ :)

代碼

/*Correction proccess*/ 
$('.hover_row_product').click(function (e) { 
    var checkbox = $(this).find(':checkbox'); 
    if ($(e.target).closest('input[type="checkbox"]').length > 0) { 
     //check box clicked 
    } else { 
     checkbox.prop('checked', !checkbox.prop('checked')); 
    } 
    $prod_id = checkbox.attr('product_id'); 
    $input_checked = 2; 
    if (checkbox.is(':checked')) { 
     $input_checked = 1; 
     $('.pr_row_' + $prod_id).addClass('corrected_row'); 
    } else { 
     $input_checked = 0; 
     $('.pr_row_' + $prod_id).removeClass('corrected_row'); 
    } 
});

來源

2013-11-10 08:11:09

我看到所需的功能，當我切換線路7上attr()調用prop()：

checkbox.prop('checked', !checkbox.prop('checked'));

也許別人可以提供一個來源，但我不相信瀏覽器將始終將「checked」屬性註冊爲實際屬性，除非它是手動操作的（與本地功能相反：clic國王在複選框）。當然，它始終可以作爲複選框對象本身的屬性。

來源

2013-11-10 08:14:44

檢查父元素上的複選框點擊

回答

相關問題