当前位置: 首页 > 面试题库 >

jQuery禁用/启用提交按钮

姜鹏程
2023-03-14
问题内容

我有这个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');
        }
    });
});

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


问题答案:

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

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


 类似资料:
  • 问题内容: 单击后,我编写了以下代码以禁用网站上的提交按钮: 不幸的是,它没有发送表格。我怎样才能解决这个问题? 编辑 我想绑定提交,而不是表格:) 问题答案: 做到: 发生的事情是您实际上在完全触发该提交事件之前禁用了该按钮。 您可能还应该考虑使用ID或CLASS来命名元素,因此不要在页面上选择所有提交类型的输入。 (请注意,我使用,因此该表单在示例中并未实际提交;请在使用时将其保留。)

  • 问题内容: 提交表单时,我正在使用jquery $ .post。我想在单击按钮后禁用按钮约5秒钟,以避免多次提交表单。 这是我现在所做的: 我之前使用了fadeIn和fadeOut,但是当我快速测试单击按钮时仍然无法正常工作。我应该怎么做才能实现自己想实现的目标? 问题答案: 您可以这样操作: 或者您可以使用ajax收到响应后正在执行的jQuery 方法: 编辑: 这是一个 3秒钟服务器端响应延迟

  • 问题内容: 我有一个看起来像这样的表格: 当我绑定到表单的Submit()时,似乎无法访问用户单击的图像。因此,我试图绑定到单击图像本身(),该图像总是提交表单,无论我是否尝试 返回false; event.stopPropogation(); 要么 event.preventDefault(); 因为所有这些都是表单事件。 我应该将$ .post()附加到form.submit()事件上吗,如果

  • 问题内容: PrimeFaces在按Enter键时禁用提交。 我正在运行在WildFly 8.2 Final上运行的PrimeFaces 5.1。 我有对话框,有两个inputNumbers和两个按钮。并且第一个inputNumber对ajax模糊事件进行一些计算。按钮旁边是在bean中进行一些计算的按钮。问题是,当用户在焦点位于inputNumber时按Enter时,按钮的动作被触发,这确实很烦

  • 问题内容: 我的页面中似乎没有以下javascript,但无法正常运行。 我想在输入时禁用提交表单,或者更好的是,将其称为ajax表单提交。两种解决方案都可以接受,但是我上面包含的代码不会阻止表单的提交。 问题答案: 如果未捕获,请捕获: 编辑:错过了,最好使用而不是 编辑2:正如在某些较新版本的Firefox中一样,不阻止表单提交,因此将keypress事件添加到表单也更安全。通过将事件仅绑定到

  • 我的页面中有以下javascript,它似乎不起作用。 我想在回车时禁用提交表单,或者更好的是,调用我的ajax表单提交。这两种解决方案都是可以接受的,但是我上面包含的代码不会阻止表单提交。