-2

我正在尝试使文本框只读或不取决于个人贷款复选框的值。如果选中 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复选框的onchange，这样我就可以使文本框在该行中只读或不只读（td）

谢谢

4

2 回答 2

1

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

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

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

jsFiddle 上的演示。（我用红色突出显示了复选框。）

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

于 2013-07-02T00:15:44.153 回答
1

在我看来，您确实需要单选按钮，而不是复选框，并且如果用户选择“无贷款”，则金额字段应设置为禁用而不是只读。

无论如何，这是您可以采取的一种方法。为方便起见，我将代码放在了行中，它可以在 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>
于 2013-07-01T23:15:48.103 回答