jquery - 以编程方式更改文本大小会阻止更改事件

Question

我们有一个文本框，用户应该在其中输入一些数据。但是，该数据不得超过 500 个字符。为了实现这一点，我们实现了在 KeyUp 事件上调用的以下函数:

        function keyupMaxLimit(obj, maxlen) {
            if (parseInt(obj.value.length) > maxlen) {
                $(obj).val($(obj).val().substr(0,maxlen));
            }
        }

这有效:用户无法输入更多内容。 我们还有一个与同一文本框的 Change 事件关联的函数，以便检测更改并发挥我们的魔力。

    $(document).on("change", "#myTextBox", function () {
        //magic here
    });

这也有效:当用户更改文本时，将调用该函数。

但是，这是我们的问题，这两个函数不能一起工作。例如，如果用户引入了更多他/她应该引入的字符，第一个函数将修剪文本，但第二个函数将不会被调用!

看来我们对第一个函数的文本框所做的更改正在阻止/清除更改事件。它是否正确？有什么解决办法吗？我无法在第一个函数上显式触发 Change 事件，因为我们会创建不必要的更改。

编辑 - 您可以在这里看到这种情况发生:http://jsfiddle.net/jpaires/dpujx/ 打开浏览器的控制台并在文本框中写入“12345”。该事件将被触发(控制台上显示“a-ok”)。但是，如果您写入“123456”，文本将被剪切并且事件将不会被触发(控制台上不会出现“a-ok”)。谢谢尤哈娜:)

Answer 1

我应该尝试限制 html 输入中的字符数，如下所示:

<input type="text" id="Textbox" name="Textbox" maxlength="500" />

另一件事是，如果您想在文本输入更改时执行某些操作，我认为在这种情况下您也可以在输入上使用 keyup 事件，如下所示:

$(document).on("keyup", "#myTextBox", function () {
 //SOMETHING
});

我用我的建议更新了这个 fiddle ，它有效...... http://jsfiddle.net/BdqDB/

通过这种方式，您始终会触发日志并且文本受到限制。

另一个解决方案是: 如果你想继续使用你的功能来剪切文本，我会这样做:

$(document).on("keyup", "#myTextBox", function () {
  keyupMaxLimit(this,5);
  console.log('other stuff');
});

请参阅 http://jsfiddle.net/wTQa4/1/ 上的此操作

如果您检查 jquery 更改文档，您可以找到: “当元素的值发生变化时，change 事件会发送到元素。此事件仅限于元素、框和元素。对于选择框、复选框和单选按钮，当用户使用以下选项进行选择时，会立即触发该事件鼠标，但对于其他元素类型，事件将被推迟，直到元素失去焦点。”

所以我认为这个问题的答案是，你不会通过变更事件得到你想要的东西，我给了你问题的解决方案，但你没有发送反馈...... 您不应该做的另一件事是内联调用 js 方法，一旦您使用 jQuery，将事件绑定(bind)到元素非常容易，并且它是不引人注目的 javascript，是编写 js 的最佳实践。