javascript - 如果不符合条件，如何禁用其中一个输入字段

Question

我的问题是如果在以下情况下不符合条件，如何禁用其中一个输入字段:如果用户选择现金，则必须禁用属性名称为 credit 的输入字段，以便用户不能填写它。反之亦然，如果用户选择兑现，则应禁用具有借记属性名称的输入字段。我尝试创建这些脚本，但它无法正常运行。

<script type="text/javascript" src="jquery.min.js"></script>
<script>
$('#acc').click(function(){
    var account = $("select#acc").val();
    if (account == "db"){
        $('#credit').prop('disabled', true);
    }
    else if (account == "cr"){
        $('#debit').prop('disabled', true);
    }
});
</script>
<table>
<tr><td>Account</td><td>Debet</td><td>Credit</td></tr>
<tr>
    <td>
        <select id="acc" name="acc" required="required"> 
            <option value=""></option>
            <option value="db">Cash-In</option>
            <option value="cr">Cash-Out</option>
        </select>
    </td>
    <td><input type="text" id="debit" name="debit" /></td>
    <td><input type="text" id="credit" name="credit" /></td>
</tr>
</table>

Answer 1

使用 .change() 事件代替 .click() 事件。

$('#acc').change(function(){
    var account = $("select#acc").val();
    if (account == "db"){
        $('#credit').prop('disabled', true);
        $('#debit').prop('disabled', false);
    }
    else if (account == "cr"){
        $('#debit').prop('disabled', true);
        $('#credit').prop('disabled', false);
    }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<table>
<tr><td>Account</td><td>Debet</td><td>Credit</td></tr>
<tr>
    <td>
        <select id="acc" name="acc" required="required"> 
            <option value="">Select</option>
            <option value="db">Cash-In</option>
            <option value="cr">Cash-Out</option>
        </select>
    </td>
    <td><input type="text" id="debit" name="debit" /></td>
    <td><input type="text" id="credit" name="credit" /></td>
</tr>
</table>