Удалить кнопку отключения, если текстовое поле имеет значения внутри

Question

Может ли кто-нибудь помочь мне удалить атрибут отключения кнопки, если текстовые поля с классом (number) имеют значения внутри и отключить снова, если текстовое поле пуст.

текущий код: Код

<input type="text" name="name" class="number" value="hello" readonly /> 
<input type="submit" name="send" id="send" disabled /> 

сценарий:

<script type="text/javascript"> 
$('.number').on('input', function() { 
    $('#send').prop("disabled", !$.trim(this.value)); 
}); 
</script> 

Answer 1

использование:

$('.number').keyup(function() { 
    if($(this).val() != '') { 
     $('#send').removeAttr('disabled'); 
    }else{ 
     $('#send').attr('disabled',true); 
    }}); 

Answer 2

Вы можете слушать keydown событий, и каждый раз при нажатии клавиши, вы проверьте значение элемента:

$(".number").on("keydown", function (e) { 
    var current_value = $(this).val(); 
    // The keypress event actually happens before the character is inserted. 
    var value = $.trim(current_value + e.which); 
    if (value.length > 0){ 
     $("#send").attr("disabled", false); 
    } 
}); 

Единственная проблема с этим подходом заключается в том, что он не будет работать, если пользователь скопирует значение в текстовое поле. Альтернативой будет использование setInterval для проверки ввода каждые X секунд.

Answer 3

Ваш текущий код работает нормально: JSFiddle demo.

Проблема заключается в том, что ваш элемент .number установлен в readonly, то есть он не принимает никаких input (это событие, которое вы обрабатываете).

Если вы устанавливаете свойство readonly на стороне сервера, я полагаю, вы также можете установить свойство disabled на стороне сервера.

Answer 4

Попробуйте так:

/* The keyup event fires right after the user releases a key */ 
    $(".search-bar").on("keyup", function() { 
     var state = this.value === ""; 
     $("#send").attr("disabled", state); 
    }) 

Answer 5

попробовать что-то вроде этого

$('.number').on('change', function() { 
    if ($(this.val() == '') { 
     $('#send').removeAttr('disabled'); 
    } else { 
     $('#send').attr('disabled', ''); 
    } 
});