javascript - Safari问题文本输入,当用户输入文本时,文本会导致文本丢失

  显示原文与译文双语对照的内容
0 0

我的页面上有以下输入元素:

<input class="input" name="custom_fields[new]" placeholder="Enter placeholder" type="text">

我在这里元素上有一个 Twitter Flight事件侦听器,它的外观如下所示:

this.on('keyup', {
 inputsSelector: this.updateViewInputs
});

触发这里方法:

this.updateViewInputs = function(ev) {
 var isDeletionKeycode = (ev.keyCode == 8 || ev.keyCode == 46);
//Remove field is user is trying to delete it
 if (isDeletionKeycode && this.shouldDeleteInput(ev.target.value, this.select('inputsSelector').length)) {
 $(ev.target.parentNode).remove();
 }
//Add another field dynamically
 if (this.select('lastInputsSelector')[0] && (ev.target == this.select('lastInputSelector')[0]) &&!isDeletionKeycode) {
 this.select('inputsContainer').append(InputTemplate());
 }
//Render fields
 that.trigger('uiUpdateInputs', {
 inputs: that.collectInputs()
 });
}

最后触发 uiUpdateInputs:

this.after('initialize', function() {
 this.on(document, 'uiUpdateInputs', this.updateInputs)
});
this.updateInputs = function(ev, data) {
//Render all inputs provided by user
 this.select('inputListSelector').html(InputsTemplate({ inputs: data.inputs }));
}

所有这些功能在 Chrome 和 Firefox 上都能正常工作。 用户可以输入到输入中,并在'实时'中看到页面。 用户还可以获得其他字段,它们可以输入文本并查看页面更改。

当用户输入文本时,输入字段中的文本将突出显示,并将所有内容替换为( 选定) 。 这将导致用户在使用下一个输入字符替换为 1个字符之前不能输入多于个字符。

我尝试了几种解决这里问题的方法,但没有一种方法有效,它们包括:

  • 使用setTimeout延迟在事件上运行的代码
  • 使用选择尝试禁用使用 collapseToEnd控件的文本选择。
  • 使用单击,焦点,模糊事件尝试从输入的文本中删除选定内容
  • 触发右箭头键事件,尝试简单地向前移动 cursor,这样他们就不会对选定的文本进行
  • 使用setInterval常规删除窗口所做的选择

我很清楚为什么这会发生,我想知道这是否是 Bug 中的webkit 。 我认为这个页面的Firefox 或者 Chrome 版本没有问题。 感谢你的帮助!

时间:原作者:4个回答

0 0

这似乎是Safari某些版本的问题。 当在javascript中监听keyup函数时,它会自动选择框中的所有文本,然后在输入下一个键时将所有文本都。 防止事件发生在传递给函数的事件对象上。

this.on('keyup', function(e) {
 e.preventDefault()
});
原作者:
...