Jak mogę wyłączyć przycisk przesyłania, dopóki tekst nie zostanie wprowadzony w polu wejściowym?

Question

Mam problem, próbuję osiągnąć ten wynik, prawie to, czego potrzebuję, to wyłączyć przycisk przesyłania, dopóki tekst nie zostanie wprowadzony w polu wejściowym. Próbowałem niektóre funkcje, ale bez wyników. Proszę, jeśli możesz mi w tym pomóc, byłoby to naprawdę docenione.

HTML Markup

<form action="" method="get" id="recipename"> 
<input type="text" id="name" name="name" class="recipe-name" 
    value="Have a good name for it? Enter Here" 
    onfocus="if (this.value == 'Have a good name for it? Enter Here') {this.value = '';}" 
    onblur="if (this.value == '') {this.value = 'Have a good name for it? Enter Here';}" 
/> 
<input type="submit" class="submit-name" value="" /> 
</form> 

Dzięki z góry.

Answer 1

Można to wykorzystać:

var initVal = "Have a good name for it? Enter Here"; 
$(document).ready(function(){ 
    $(".submit-name").attr("disabled", "true"); 
    $(".recipe-name").blur(function(){ 
     if ($(this).val() != initVal && $(this).val() != "") { 
      $(".submit-name").removeAttr("disabled"); 
     } else { 
      $(".submit-name").attr("disabled", "true");   
     } 
    });  
}); 

Zobacz w jsfiddle.

Answer 2

wywołanie niektórych funkcji javascript jak poniżej (dając przykład dla jQuery) w onkeyup imprezy

function handleSubmit() 
{ 
if($.trim($('#name').val() == '')) 
{ 
$('.submit-name').attr('disabled','disabled'); 
} 
else 
{ 
$('.submit-name').attr('disabled',''); 
} 
} 

Answer 3

$("#textField").keyup(function() { 
    var $submit = $(this).next(); // or $("#submitButton"); 
    if(this.value.length > 0 && this.value != "Default value") { 
     $submit.attr("disabled", false); 
    } else { 
     $submit.attr("disabled", true); 
    } 
}); 

Answer 4

Można spróbować to:

var nameText = $("#name"); 

nameText.attr("disabled", "disabled"); 

nameText.change(function() { 
    if(nameText.val().length > 0) { 
    nameText.attr("disabled", ""); 
    } else { 
    nameText.attr("disabled", "disabled"); 
    } 

}); 

Answer 5

Jedyny problem z zaakceptowanej rozwiązania jest to, że przycisk jest aktywny tylko po fokus jest usuwany z pola tekstowego (po wprowadzeniu danych w niej oczywiście). Czy przycisk powinien być włączony, gdy tylko tekst zostanie wprowadzony w polu? Oto rozwiązanie, które to implementuje.

Link do innego rozwiązania: Keep button disabled if text is not entered

coś takiego:

$('.recipe-name').on("keyup", action); 
function action() { 
    if($('.recipe-name').val().length > 0) { 
     $('#submit-name').prop("disabled", false); 
    }else { 
     $('#submit-name').prop("disabled", true); 
    } 
}