我有这个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相关问答推荐

你怎么看啦啦队的回应?

阿波罗返回的数据错误,但在网络判断器中是正确的

为什么Mutations 观察器用微任务队列而不是macrotask队列处理?

可更改语言的搜索栏

在我的index.html页面上找不到我的Java脚本条形图

try 将Redux工具包与MUI ToggleButtonGroup组件一起使用时出错

如何使用Astro优化大图像?

JavaScript将字符串数字转换为整数

如何在加载页面时使锚定标记成为焦点

在点击链接后重定向至url之前暂停

material UI自动完成全宽

我想为我的Reaction项目在画布上加载图像/视频,图像正在工作,但视频没有

将匿名函数附加到链接的onClick属性

Html/JS:如何在脚本执行前阻止呈现?

TS node 找不到依赖的模块

webpack 5和mini-css-extract-plugin在将scss保存到css文件后不加载css

在脚本设置中使用Vue3 v-html,无需额外的换行标记

对两个不同值的数组进行排序,并保持平面数组 struct

如何合并对象列表中的连续重复值?

在Next.js v12.3.1和Reaction v18.2.0";中缩小了REACT错误#418和#423