无法触发 h:selectonemenu onselect 事件答案

【问题标题】：Can not trigger the h:selectonemenu onselect event无法触发 h:selectonemenu onselect 事件
【发布时间】：2011-09-11 12:42:59
【问题描述】：

<h:selectOneMenu id="queueSelectMenu" styleClass="selectOneMenue-style" 
    tabindex="1" value="#{reworkQueueMB.queueType}" onselect="alert('2');" >
    <f:selectItems value="#{queueMB.queueSelectItems}" />
</h:selectOneMenu>

当我选择selectmenu的项目时，我想得到select事件，但它不起作用。
我不想使用change事件，因为当我选择一个已经被选中的项目时，change事件会再次被触发。

【问题讨论】：

@Jigar :
我之前也遇到过这个问题，无法解决。我注意到它似乎发生在 SelectItems 而不是 Strings 上。
所以你的意思是，如果使用 selelctItem 和 string ，这个问题就解决了。
你应该接受答案
onchange 文档说：当这个元素失去焦点并且它的值在获得焦点后被修改时执行的Javascript代码。所以，理论上，这不应该发生。

标签： java jquery jsf jsf-2

【解决方案1】：

HTML DOM select 事件仅在您选择（突出显示）文本输入字段中的文本时触发，例如 <input> 和 <textarea>。但是 <h:selectOneMenu> 呈现 HTML <select> 元素，而不是 <input> 元素。它不允许您在字段中选择文本。 select 事件在这里什么都不做。

从技术上讲，在每个 <option> 元素上设置 click 事件应该适合您。

<h:form id="formId">
    <h:selectOneMenu id="menuId" value="#{reworkQueueMB.queueType}">
        <f:selectItems value="#{queueMB.queueSelectItems}" />
    </h:selectOneMenu>
    <script>
        $("[id='formId:menuId'] option").click(function() {
            alert("2");
        });
    </script>
    ...

但是，这确实（不出所料）不能在任何 IE 浏览器中工作，甚至不能在 IE9 中工作。

您最好的选择确实是change 事件。这是完全跨浏览器。一个完全不同的替代方法是使用单选按钮组，它可以由<h:selectOneRadio> 呈现。 click 事件应该完全符合您的要求。

<h:selectOneRadio value="#{reworkQueueMB.queueType}" onclick="alert('2')">
    <f:selectItems value="#{queueMB.queueSelectItems}" />
</h:selectOneRadio>

【讨论】：

谢谢。你让我受益匪浅。