如何在複選框被選中時使Textfield可編輯？

實際上，我有很多複選框和文本框通過單個代碼來自數據庫。我希望當我檢查perticular複選框時，然後複選框前面的一個textfied是bieng可編輯的。所以我該怎麼做？如何在複選框被選中時使Textfield可編輯？

這是我的PHP代碼

<div class="my"> 
     <?php 
     while($ass = mysql_fetch_array($rs)) 
      { ?> 
      <input type="checkbox" name="fees_name[]" id="fee_name" value="<?php echo $ass['fees_name'];?>"> <?php echo $ass['fees_name']; ?> 

<input id="fee_amt" class="fee_amt" type="text" placeholder="amt" name="fees_amt[]" > 
        <br><br> 
     <?php } ?> // my while loop end here 
      </div>

和我的javascript

<script> 
    $(document).ready(function(){ 

    $('#fee_name').click(function() { 

    $('#fee_amt').prop('disabled', !$(this).is(':checked')); 

    }); 
    }); 
</script>

但它的工作只有一個複選框。任何人都可以告訴我我能爲他人做些什麼，以及如何爲每個文本字段創建不同的ID？我的文本字段僅由一個代碼創建。。

來源

2013-10-17 Asif

你的[標籤：PHP】（幾乎）無關，你可以改爲發佈您的HTML？ –

以下行被渲染多次：

<input type="checkbox" name="fees_name[]" id="fee_name" value="<?php echo $ass['fees_name'];?>"> <?php echo $ass['fees_name']; ?>

這意味着ID fee_name不會是唯一的，這是不好的做法（和它僅適用於第一項的原因）。

嘗試像這樣的：

代替id="fee_name"把class="fee_name"（有重複使用的類名，不同ID的沒有問題）。

和更換您的jQuery代碼如下：

$(function(){ 
    $('.fee_name').click(function(){ 
     $(this).next('.free_amt').prop('disabled', $(this).is(':checked')); 
    }); 
});

希望幫助。

來源

2013-10-17 07:34:57 geevee

你可以這樣說：

不要使用相同的id多個元素
如果使用，那麼只有先得到它的事件

這樣的解決方法是：

改用類名
這樣你可以在單頁

適用相同的類名到多個elems的試試這個下面：

記：你必須先禁用輸入型文本。

<input class="fee_amt" type="text" placeholder="amt" 
               name="fees_amt[]" disabled/>

然後應用腳本

$('.fee_name').change(function() { 
    $(this).siblings('.fee_amt').prop('disabled', !this.checked); 
});

See the code in Action

來源

2013-10-17 07:37:29 Jai

這裏是工作的代碼，你需要什麼，

$("input[type=checkbox]").on("click", function(){ 
    if($(this).is(':checked')) { 
     $(this).next().prop('disabled', false); 
    } else { 
     $(this).next().prop('disabled', true); 
    } 

});

HTML

<input type="checkbox" name="fees_name[]"> 
<input type="text" disabled="disabled" /><br/> 
<input type="checkbox" name="fees_name[]"> 
<input type="text" disabled="disabled" /><br/> 
<input type="checkbox" name="fees_name[]" > 
<input type="text" disabled="disabled" /><br /> 
<input type="checkbox" name="fees_name[]"> 
<input type="text" disabled="disabled" /><br /> 
<input type="checkbox" name="fees_name[]"> 
<input type="text" disabled="disabled" />

JSFIDDLE

如果您需要提供姓名，那麼你可以使用input[name='fees_name[]']爲，

$("input[name='fees_name[]']").on("click", function(){ 
    if($(this).is(':checked')) { 
     $(this).next().prop('disabled', false); 
    } else { 
     $(this).next().prop('disabled', true); 
    } 

});

JSFIDDLE

來源

2013-10-17 07:55:24

已更新'JSFIDDLE' –

如何在複選框被選中時使Textfield可編輯？

回答

相關問題