在 InputText 中添加或删除可见字符后触发 valueChange 事件答案

【问题标题】：Trigger valueChange event after a visible character is added or removed in InputText在 InputText 中添加或删除可见字符后触发 valueChange 事件
【发布时间】：2020-04-06 00:00:20
【问题描述】：

我需要一个 valueChange 事件，每次添加或删除可见字符时都会触发该事件。

我有 2 个输入文本字段，其中一个是只读的，一个是命令按钮。

<div>
  <p:inputText>
    <p:ajax id="encodedString" event="valueChange"/>
  </p:inputText>

  <p:commandButton action="#{bean.foo}" update="output"/>

  <p:inputText id="output" readonly="true">
  </p:inputText>
</div>

现在，用户在第一个字段中输入一些编码字符串并按下按钮，然后解码字符串并在只读输入字段中以人类可读的形式呈现。现在，每当用户操作原始字符串时，都应该重置输出，因为它不再代表原始编码字符串。

遗憾的是，valueChange 事件仅在输入字段失去焦点时触发。我已经尝试过keypress 事件，但它也会在按下箭头键等按钮时触发。

JavaScript 对我来说是可行的，但如果可能的话应该省略。

每当实际输入发生变化时，触发valueChange事件（或类似事件）的最佳方式是什么？ IE。添加或删除可见字符时。

【问题讨论】：

JSF 通常使用默认的 JavaScript 事件来触发 AJAX。我不知道每次更改文本字段内容时都会触发的 javascript 事件。我认为需要一些 javascript。
我觉得这条评论对这篇文章没有太大帮助，但我也不想忽略它。感谢您关心我的问题:)
Javascript 的 input 事件应该满足您的需求。
inputText 也有一个 keydown 事件，使用那个家伙
你最后的问题得到了回答：只需使用 keydown 事件来确保它总是得到输入文本的更改

标签： jsf primefaces

【解决方案1】：

您必须使用的 inputText 不支持值更改事件键入或模糊

<p:inputText>
    <p:ajax id="encodedString" event="keyup"/>
  </p:inputText>

【讨论】：

不。 OP不想触发ajax，例如箭头按钮被按下。

【解决方案2】：

您基本上需要 HTML DOM input 事件。不幸的是，这个相对较新的事件是 <p:ajax> 中的 <p:inputText> 中的 not supported，因为 oninput 属性在 <p:inputText> 中是 not supported（还没有？）。

但是，您可以使用JSF 2.2's passthrough attributes feature 来强制JSF 呈现oninput 属性，而您又显式触发默认的onchange() 函数。

<... xmlns:a="http://xmlns.jcp.org/jsf/passthrough">

<p:inputText value="#{bean.value}" a:oninput="onchange()">
    <p:ajax listener="#{bean.listener}" />
</p:inputText>

确实，这涉及到 JavaScript，但实际上只是一点点。

请注意，我从 <p:ajax> 中删除了 event="valueChange"，因为那已经是 the default one。

【讨论】：