2015-06-11 5 views
0

У меня есть текстовое поле и кнопка отправки рядом с ним. Кнопка находится в отключенном состоянии. Когда пользователь вводит что-то в текстовое поле, он должен быть включен. Это прекрасно работает. Но как только пользователь начнет печатать, он активируется. И если backspace используется, чтобы сделать поле пустым, кнопка все еще остается в разрешенном состоянии.onkeyup не работает, когда текстовое поле пуста

<html> 
<body> 
    <input type="text" id="fname" onkeyup="myFunction()"> 
    <input type="button" id="a" disabled = "true" value ="click me"> 
    <script> 
    function myFunction() 
    { 
     var x = document.getElementById("fname"); 
     x.value = x.value.toUpperCase(); 
     if(x.value != " ") 
     { 
     document.getElementById('a').disabled=false; 
     } 
    } 
    </script> 
</body> 
</html> 

ответ

3

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

<html> 
<body> 
<input type="text" id="fname" onkeyup="myFunction()"> 
<input type="button" id="a" disabled = "true" value ="click me"> 

<script> 
function myFunction() { 

    var x = document.getElementById("fname"); 
    x.value = x.value.toUpperCase(); 
    if(x.value != "") 
{ 
    document.getElementById('a').disabled=false; 
}else { 
document.getElementById('a').disabled=true; 
} 
} 
</script> 
</body> 
</html> 
0

Вы очень близки. Все, что вам нужно сделать, это проверить свойство length и добавить оператор else, чтобы отключить кнопку, когда в текстовом поле нет значения.

<html> 
 
<body> 
 
<input type="text" id="fname" onkeyup="myFunction()"> 
 
<input type="button" id="a" disabled = "true" value ="click me"> 
 

 
<script> 
 
function myFunction() { 
 
    var x = document.getElementById("fname"); 
 
    x.value = x.value.toUpperCase(); 
 
if(x.value.length > 0) 
 
{ 
 
    document.getElementById('a').disabled=false; 
 
} 
 
else 
 
{ 
 
    document.getElementById('a').disabled=true; 
 
} 
 
} 
 
</script> 
 
</body> 
 
</html>

0

Я предлагаю вам этот код в HTML

<input type="submit" id="register" value="Register" disabled="disabled" /> 

и сделать ниже изменения в JavaScript

(function() { 
$('form > input').keyup(function() { 

    var empty = false; 
    $('form > input').each(function() { 
     if ($(this).val() == '') { 
      empty = true; 
     } 
    }); 

    if (empty) { 
     $('#register').attr('disabled', 'disabled'); // updated according to http://stackoverflow.com/questions/7637790/how-to-remove-disabled-attribute-with-jquery-ie 
    } else { 
     $('#register').removeAttr('disabled'); // updated according to http://stackoverflow.com/questions/7637790/how-to-remove-disabled-attribute-with-jquery-ie 
    } 
}); 

Я думаю, что это действительно работает well.Hope вы получите желаемую операцию. Спасибо.

0

Вы должны написать, если другое условие для работы соответственно, Demo, и стараются избегать добавления слушателей событий непосредственно к разметке :)

$('#fname').keyup(function() { 
    //console.log('wor'); 
    if(!$(this).val() == '') { 
     $('#a').prop("disabled", false); 
    } 
    else{ 
     $('#a').prop("disabled", true); 
    } 
}) 
0

обновить сценарий, как показано ниже

function myFunction() { 
     var x = document.getElementById("fname"); 
     x.value = x.value.toUpperCase(); 
     if (x.value.length != 0) {--here is the change 
      document.getElementById('a').disabled = false; 
     } 
     else { 
      alert('Empty'); 
      document.getElementById('a').disabled = true; 
     } 
    } 
Смежные вопросы