一尘不染

jQuery禁用/启用提交按钮

javascript

我有这个HTML:

<input type="text" name="textField" />
<input type="submit" value="send" />

我该如何做这样的事情:

  • 当文本字段为空时,应禁用提交(disabled =“ disabled”)。
  • 在文本字段中键入内容以删除禁用的属性时。
  • 如果文本字段再次变为空(删除了文本),则应再次禁用提交按钮。

我尝试过这样的事情:

$(document).ready(function(){
    $('input[type="submit"]').attr('disabled','disabled');
    $('input[type="text"]').change(function(){
        if($(this).val != ''){
            $('input[type="submit"]').removeAttr('disabled');
        }
    });
});

…但这不起作用。有任何想法吗?


阅读 311

收藏
2020-04-25

共1个答案

一尘不染

问题在于,仅当焦点从输入移开(例如,有人单击输入或将选项卡移出输入)时,更改事件才会触发。尝试改用keyup:

$(document).ready(function() {
     $(':input[type="submit"]').prop('disabled', true);
     $('input[type="text"]').keyup(function() {
        if($(this).val() != '') {
           $(':input[type="submit"]').prop('disabled', false);
        }
     });
 });
2020-04-25