jQuery禁用/启用提交按钮

以你之姓@ 2024-03-30 17:50 14阅读 0赞

## 问： ##

我有这个 HTML：

我该怎么做这样的事情：

当文本字段为空时，应禁用提交 (disabled=“disabled”)。

在文本字段中键入内容以删除禁用属性时。

如果文本字段再次变为空（文本被删除），则应再次禁用提交按钮。

我试过这样的事情：

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

……但它不起作用。有任何想法吗？

> huntsbot.com精选全球7大洲远程工作机会，涵盖各领域，帮助想要远程工作的数字游民们能更精准、更高效的找到对方。

## 答1: ##

> huntsbot.com高效搞钱，一站式跟进超10+任务平台外包需求

问题是仅当焦点从输入移开时才会触发更改事件（例如，有人单击输入或标签退出）。尝试使用 keyup 代替：

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

`prop('disabled', true) 方法应该在 attr('disabled','disabled') 方法上使用 see the docs on prop()`

## 答2: ##

> huntsbot.com高效搞钱，一站式跟进超10+任务平台外包需求

$(function() {
        
      $(":text").keypress(check_submit).each(function() {
        
        check_submit();
      });
    });
    
    function check_submit() {
        
      if ($(this).val().length == 0) {
        
        $(":submit").attr("disabled", true);
      } else {
        
        $(":submit").removeAttr("disabled");
      }
    }

## 答3: ##

> 保持自己快人一步,享受全网独家提供的一站式外包任务、远程工作、创意产品订阅服务–huntsbot.com

这个问题已有 2 年历史，但它仍然是一个很好的问题，它是 Google 的第一个结果…但所有现有答案都建议设置和删除 HTML 属性 (removeAttr(“disabled”)) “disabled”，这不是正确的方法。关于属性与属性有很多混淆。

HTML

标记 is called a boolean attribute by the W3C 中 中的“已禁用”。

HTML 与 DOM

引用：

一个属性在 DOM 中；一个属性位于解析为 DOM 的 HTML 中。

https://stackoverflow.com/a/7572855/664132

jQuery

有关的：

尽管如此，关于checked 属性最重要的概念是它不对应于checked 属性。该属性实际上对应于 defaultChecked 属性，应该只用于设置复选框的初始值。选中的属性值不会随着复选框的状态而改变，而选中的属性会。因此，确定是否选中复选框的跨浏览器兼容方法是使用属性…