jquery - 使用 JSF 和 jQuery 绑定(bind)基于 ID 的事件

Question

我在使用 JQuery 和 JSF/Richfaces 时遇到问题。我在表单组件中有一个 inputText 组件。

<h:form id="myForm">
<h:inputText id="myInputField" value="#{myBean.sampleName}" />

我有以下 jQuery 代码:

MySite.supplier= function() {

  // Only attach event listener if the element exists on page
  if ( jQuery('#myInputField') ) {
    jQuery('#myInputField').bind('paste', MySite.common.handleMousePaste.bind(this));
  }

};

MySite.common.handleMousePaste = function(event) {

  // Need to put a tiny delay in so the element has time to get the pasted n content.
  setTimeout(function() { jQuery("#" + event.target.id).keyup(); }, 10);
};

问题是我的 inputField 的渲染方式。它添加了表单名称，如下所示:

myForm:myInputField

所以我当前的 jQuery 代码将找不到要绑定(bind)的 ID。

我没有使用完整表单名称 jQuery('#myForm\\:myInputField') 引用它的原因是因为我在整个网站的多个位置都有一个名为“myInputField”的字段(每个页面一次)

有没有人有任何解决方案可以在“MySite.supplier”方法以及我拥有 event.target.id 的“MySite.supplier”方法中正确绑定(bind)到 ID？

谢谢

Answer 1

您可以为文本框分配一个类，然后简单地使用类选择器来绑定(bind)您的粘贴事件吗？

<h:form id="myForm">
<h:inputText id="myInputField" value="#{myBean.sampleName}" styleClass="bindPaste" />

if ( jQuery('.bindPaste') ) {
    jQuery('.bindPaste').bind('paste', MySite.common.handleMousePaste.bind(this));
}

jsfiddle 上的简单示例.