如何在onkeyup事件中从输入的字符串中删除特殊字符。
使用内联事件处理程序通常不是一个好主意。替代方法是使用`input`事件和委托处理程序：
{
document.addEventListener("input", textOnly, true);
function textOnly(evt) {
const origin = evt.target;
if (origin.id === "textOnly") {
origin.value = origin.value
.replace(/[^a-z0-9]$/i, "");
// ^ 仅替换最后输入的字符
}
}
}
上述代码的目的是在``元素上监听`input`事件，并使用正则表达式将特殊字符从输入字符串中移除。代码首先通过`addEventListener`方法将`input`事件绑定到`document`对象上。然后，定义了一个名为`textOnly`的函数作为事件处理程序。在该函数中，通过`evt.target`获取到触发事件的元素，并判断其`id`是否为"textOnly"。如果是，就使用`replace`方法和正则表达式`/[^a-z0-9]$/i`来替换掉输入字符串中的特殊字符。最后，将处理后的字符串赋值回输入框中。
这种方法的优点是将事件处理程序与HTML代码分离，使代码更清晰易读。它使用了事件委托的方式，可以处理多个相同类型的元素，而不需要为每个元素都绑定事件处理程序。
总结起来，通过使用`input`事件和委托处理程序，可以在输入框中实时移除特殊字符，提高用户输入的准确性。
问题的出现原因是在onkeyup事件中，通过更改value值并不会替换原始值，而是返回一个新的字符串。一旦进行替换，必须将其重新赋值给this.value，这样就可以解决问题。
另外，正则表达式模式不需要加引号，它以'/'开始和结束。因此，需要将引号去掉。
建议使用addEventListener在JS中处理事件，而不是使用内联事件监听器，因为内联事件监听器被认为是不良实践。
解决方法如下：
更多阅读 - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/replace
