Question

我在表单中有一个输入字段，该类会动态更改，具体取决于ajax脚本（我无法修改）从“foo”到“foo bar”返回“foo”。我希望修改该字段的样式，当它的长度为＆gt; 0，它的值不包含“nid”，它的类不是“bar”。我的第一个想法是有一个setTimeout，每当输入字段的类为“bar”时调用它，直到它为“foo”。但我不知道这是好的做法，也不知道怎么做......

Answer 1

最简单的方法是绑定元素上的change或keydown事件，以捕获字段内容是否匹配。

如果匹配，则添加一个类fx baz，如果匹配则删除该类。

这样就可以使用CSS为元素设置样式。使用类bar制定规则，该规则将覆盖类baz的规则。

Answer 2

使用输入keyup

的field事件

Answer 3

这样做很好。或者您可以使用将重复触发的setInterval，然后在满足条件后调用clearInterval。

Answer 4

您可能需要查看my jQuery plugin来检测用户输入。它规范了所有主流浏览器中的HTML5 oninput事件，因此它可以检测键盘输入，拼写更正，粘贴，拖动和放大。丢弃等等。

使用该插件，您的代码可能如下所示：

$("#myInput").input(function () {
    var $this = $(this), val = this.value;
    if (val.length && val.indexOf("nid") === -1 && !$this.hasClass("bar"))
        $this.css("color", "red");
    else
        $this.css("color", "green");
});

工作演示：http://jsfiddle.net/hVDP8/

oninput与使用计时器或onkeyup事件相比有许多好处，例如在屏幕上绘制新值之前执行代码。事实上，它非常适合这种情况。

make setTimeout自己调用，直到Condition为True

4 个答案: