Làm cách nào để tắt nút gửi cho đến khi văn bản được nhập vào trường nhập?

Question

Tôi gặp sự cố khi cố gắng đạt được kết quả này, khá nhiều những gì tôi cần là tắt nút gửi cho đến khi văn bản được nhập vào trường nhập. Tôi đã thử một số chức năng nhưng không có kết quả. Xin vui lòng nếu bạn có thể giúp tôi với điều này nó sẽ được thực sự đánh giá cao.

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> 

Cảm ơn, trước.

Answer 1

Bạn có thể sử dụng này:

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");   
     } 
    });  
}); 

Xem trong jsfiddle.

Answer 2

gọi một số chức năng javascript như dưới đây (cho ví dụ cho jquery) trong onkeyup kiện

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

Bạn có thể thử này:

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

Vấn đề duy nhất với các giải pháp accpeted là nút được kích hoạt chỉ sau khi tập trung được lấy ra từ các lĩnh vực văn bản (sau khi nhập dữ liệu trong nó tất nhiên). Không nên bật nút ngay sau khi bất kỳ văn bản nào được nhập vào trường này? Đây là một giải pháp thực hiện điều này.

Liên kết với giải pháp khác: Keep button disabled if text is not entered

một cái gì đó như thế này:

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