无法在选择事件时触发h:selectone菜单

Question

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

当我选择select菜单的项目时，我想获得select事件，但它不起作用
我不想使用change事件，因为当我选择已经选择的项目时，change事件将再次触发。

Answer 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>