JQuery - включить текстовое поле, когда флажок

Question

$("#owncar").click(function() { 
 
    if ($(this).is(':checked')) { 
 
    $("#carnumber").attr('disabled', false); 
 
    } else { 
 
    $("#carnumber").val(''); 
 
    $("#carnumber").attr('disabled', true); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script> 
 
<tr> 
 
    <td>Have own car :</td> 
 
    <td> 
 
    <input type="checkbox" name="owncar" id="owncar" value="Y" /> 
 
    </td> 
 
</tr> 
 

 
<tr> 
 
    <td>Car Number :</td> 
 
    <td> 
 
    <input type="text" name="carnumber" id="carnumber" maxlength="10" disabled/> 
 
    </td> 
 
</tr>

Когда галочка пользователь флажок из иметь собственный автомобиль, включите номер автомобиля текстовое поле, чтобы позволить пользователю заполнить номер автомобиля.

Вышеприведенный код в порядке для меня.
Есть ли другие способы включить текстовое поле при щелчке по галочке?

Answer 1

Использование prop() установить checked статус флажком. Чтобы установить значение текстового поля, используйте val() с обратным вызовом.

// Use change event on the checkbox 
$("#owncar").change(function() { 
    // Cache checked status 
    var checked = this.checked; 

    // If checkbox is checked, enable the textfield 
    // else disable 
    $("#carnumber").prop('disabled', !checked).val(function(i, oldVal) { 
     // If the checkbox is not checked, then empty the value 
     return checked ? oldVal : ''; 
    }); 
}); 

Answer 2

Используйте removeAttr метод

$("#owncar").click(function(){ 
    if($(this).is(':checked')){ 
     $("#carnumber").removeAttr('disabled'); 
    } else { 
     $("#carnumber").val(''); 
     $("#carnumber").attr('disabled', true); 
    } 
});