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

……但它不起作用.有什么 idea 吗?

推荐答案

问题是,Change事件只有在焦点从输入移开时才会触发(例如,有人单击输入或使用Tab键离开输入).请try 改用KeyUp:

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

Javascript相关问答推荐

对不同事件类型使用通用回调时出现 TypeScript 类型错误

如何从 RTK-Query 端点访问我的store ?

Nightwatch 每次调用都使用相同的元素 Select 器

如何访问用户角色以获取我的 MERN 应用程序中的所有讲师帖子?

使用 Apps 脚本创建 Google Workspace 插件 - 变量未在函数之间正确引用

JS 函数在控制台中工作,但在 HTML 中没有 onClick 事件

CSS 背景渐变不覆盖整个页面,包括可滚动内容

Mongodb 嵌套 If 在 $Set 中

强制画布使用弹性列中的可用空间

如何删除显示 bootstrap 程序上最后使用日期的工具提示?

为什么可变播放器和当前播放器未定义?

以递归方式在项目数组中实现搜索:React JS

仅导入一个函数是否也会运行该文件中的其他函数?

表中编辑的数据应该在图表和其他组件中改变Angular

使弹出式 div 可堆叠

在Javascript中动态地将数组插入数组中

为什么我的计算器将其输入的数字加在一起而不是更新为多位数?

我如何在 revealjs 中有两种代码 colored颜色 ?

使用 Object.entries 基于数据渲染层次 struct

Laravel-9 jQuery Timepicker Disable 具体时间如何?