Question

我正在尝试将文本框设为只读或不依赖于personalLoan复选框的值。如果选中了personalLoan复选框，我希望文本不是只读的。如果未选中，则我希望文本框是只读的。这是其中一行

<tr id="mytableRows">
    <td class="even"><input type="checkbox" value="true" name="homeLoan"  ></td>
    <td class="odd"><input type="checkbox" value="true" name="autoLoan"  ></td>
    <td class="even"><input type="checkbox"  value="true" name="personalLoan"  ></td>
    <td class="odd"><input type="checkbox"  value="true" name="noLoan"  ></td>
    <td class="odd"><input type="text" name="peronalAmount" value="1"  readonly></td>
</tr>

我到目前为止已经有了这段代码

$(document).ready(function(){
    $('.test tr').click(function (event) {
        $(this).find(':checkbox').each(function(p){
            if($(this).attr('name') == 'personalLoan'){
                if ($(this).is(':checked')) {
                    alert("checked");
                }else{
                    alert("unchecked");
                }
            }
         });
    });
});

这告诉我复选框的当前状态，但我真正需要的是知道如何更改personalLoan复选框，这样我就可以在该行中使文本框成为只读（td）

感谢

Answer 1

在我看来，你真的想要单选按钮，而不是复选框，并且如果用户选择“没有贷款”，则应该将amount字段设置为disabled而不是readonly。

无论如何，这是你可以采取的方法。为了方便起见，我把代码放在了线上，它可以在jQuery中重新实现，或者你想要的任何东西，它只是一个如何做你似乎想要做的事情的例子。

使用超时，以便单击事件可用于表单中的任何元素，包括重置按钮。

<form  onclick="
  var form = this;
  setTimeout(function() {
    form.personalAmount.readOnly = form.loanType[3].checked;
  },0);
 ">
 <table>
  <tr>
    <td><input type="radio" value="homeLoan" name="loanType">Home</td>
    <td><input type="radio" value="autoLoan" name="loanType">Auto</td>
    <td><input type="radio" value="personalLoan" name="loanType">Personal</td>
    <td><input type="radio" value="true" name="loanType">None</td>
    <td><input type="text" name="personalAmount" readonly></td>
  <tr>
    <td colspan="4">
      <input type="reset">
 </table>
</form>

Answer 2

为了我自己的理智，这就是我理解的解决方案。

$('input[type=checkbox]', '.test').on('change', function(e) {
    if (this.name === 'personalLoan') {
       $(this).parents('tr').find('input[type=text]').prop('readonly', !this.checked);
    }
});

假设一个表为test的表，这允许在选中personalLoan时输入，并在未选中时切换为只读。

Demo on jsFiddle。（我用红色突出显示了复选框。）

如果不是这样，那我真的不知道你要做什么。

检查是否使用jquery在td中检查了特定的复选框

2 个答案: