当 JSF 生成 HTML 代码时，textarea 的 onPaste 属性去哪里了？

Question

我在 JSF 页面中有这个，

<textarea id="textarea" rows="4" cols="50"
                    onKeyPress="validate(event)" onPaste="validatepaste(event)"></textarea>

我没有使用 <h:inputTextarea> 的原因是因为这个 JSF 标签似乎缺少 onPaste 属性。

当我在 Google Chrome 中调试我的代码时，我很惊讶地发现 onPaste 属性不存在，呈现的 html 代码是

<textarea id="j_id_2:textarea" name="j_id_2:textarea" 
      onkeypress="return validate(event)" cols="15" rows="5"></textarea>

由于 JSF 只是一个 HTML 代码生成器，我无法理解它对 onPaste 属性的作用以及为什么不支持它？

其次。我将如何在此 html textarea 上实现值绑定？

编辑： 由于支持 onkeyup 并且是标准化的为什么 onkeyup 功能在使用 <hinputTextarea> 时会中断？

我无法实现与 html textarea 字段.[=24= 相同的效果]

一旦用户通过键盘输入或复制粘贴手动输入，以下函数将防止按字母顺序的文本被替换为“”。这是片段：

function validate(e) {
    console.log(e)
    var invalidcharacters = /[^0-9]/gi
    var phn = document.getElementById('textarea');
    if (invalidcharacters.test(phn.value)) {
        //e.value = e.value.replace(invalidcharacters, "");
        console.log("REPLACING");
        newstring = phn.value.replace(invalidcharacters, "");
        phn.value = newstring
    }
}

正常使用 html 效果很好，如下所示。这里 jsfiddle

<textarea id="textarea" rows="4" cols="50" onkeyup="validate(event)"></textarea>

无法实现相同的功能

<h:inputTextarea value="#{myBean.myValue}" id="compTextArea" 
onkeyup="validate(event)"></hinputTextarea>

并在 js 文件方法中将这一行 var phn = document.getElementById('textarea'); 替换为 document.getElementById('compTextArea');。

为什么这看起来很奇怪？

Answer 1

<textarea ... onKeyPress="..." onPaste="...">

首先，JSF使用Facelets作为视图技术。 Facelets 使用 XHTML+XML 生成 HTML。驼峰属性在 XHTML 中无效。分别是 onkeypress 和 onpaste。也许您从中获得此信息的来源将其与“onPaste”DOM 事件处理程序混淆了。

<textarea ... onkeypress="..." onpaste="...">

其次，onpaste 属性不是任何标准规范的一部分。另请参阅 HTMLElement.onpaste documentation on MDN. JSF is not designed to produce non-standard compliant code and therefore it's not available as attribute of standard <h:inputTextarea> 组件（但是 — 一旦它成为 DOM 标准的一部分，它可能会出现在未来的 JSF 版本中）。

然而，您仍然可以使用新的 JSF 2.2“HTML5 友好标记”功能实现它：passthrough attributes.

<html ... xmlns:a="http://xmlns.jcp.org/jsf/passthrough">
...
<h:inputTextarea ... a:onpaste="..." />

请注意，由于 onpaste 不是任何当前标准的一部分，其功能取决于所使用的网络浏览器 make/version。您的 Chrome 版本显然不支持它，因此它在其 DOM 检查器中是不可见的（但它在原始 HTML 源中仍然可见，您可以通过右键单击看到，查看 Source 或按 Ctrl+U).

另请参阅：

Custom HTML tag attributes are not rendered by JSF

当 JSF 生成 HTML 代码时，textarea 的 onPaste 属性去哪里了？

Where does onPaste attribute of a textarea goes when JSF generates HTML code?

html

jsf-2

另请参阅：