doutangdan3588
2013-10-24 16:05
浏览 81
已采纳

动态javascript以检测是否选中了复选框并禁用相应的输入字段

When loading a set of input fields dynamically with a PHP For clause, I want to have a checkbox for each of the rows so in case the user checks it, all input fields for that particular row will get disabled.

I need to dynamically adapt the javascript so it will disable each particular row every time the corresponding checkbox is clicked but I don't really know how to achieve it.

Here is my code:

 <?php 
for ($i=0;$i<5;$i++)
     {
   ?>
   <tr>
   <td><input id="includeItem<?=$i?>" type="checkbox" onchange="includeMore" name="item<?=$i?>"></td>
   <td><input name="id<?=$i?> style="color:#888;" disabled="disabled"></td>
   <td><input id="formItems<?=$i?>" class="datepicker" name="date<?=$i?>"></td>
   <td><input id="formItems<?=$i?>" name="description<?=$i?>"></td>
   <td><input id="formItems<?=$i?>" name="amount<?=$i?>"></td>
   </tr>
<?php } ?>

Then my javascript is as follows:

<script>
    function includeMore()  {
        var $check = $('#includeItem');
            if($('#includeItem').is(':checked')) 
                {
                $('#formItems').attr.('disabled','');
                }
            else {
                $('#formItems').attr.('disabled','disabled');
                }
        }

</script>   
  • 写回答
  • 好问题 提建议
  • 关注问题
  • 收藏
  • 邀请回答

1条回答 默认 最新

  • dongqiongjiong4740 2013-10-24 17:06
    已采纳

    First you need to add the change event listener

    var $checkboxes = $( '.class-for-the-input' );
    
    $checkboxes.on( 'change', function ( evt ) {
        //... code
    });
    

    Inside the function handler, you need to get the parent row, find all input elements that are not equals to the checkbox that was clicked, and disable it based on the state of the checkbox:

    var $this = $( this ), isChecked = this.checked,
        $els = $this.parents( 'tr' ).find( ':input' ).not( $this );
    
    if ( isChecked ) {
        $els.prop( 'disabled', 'disabled' );
    } else {
        $els.removeProp( 'disabled' );
    }
    
    已采纳该答案
    评论
    解决 无用
    打赏 举报

相关推荐 更多相似问题