Javascript Href和onclick事件不在<；面积>；

我已经用mapper.js制作了一个区域地图，在我将事件（href或onclick）放在同一区域之前，一切看起来都很好。我使用的是PrimeFacesXHTML

我的问题是：

当我调用mapper.js时，链接停止工作，但是“hover”可以正常工作

如果我没有调用“mapper.js”，那么link可以正常工作，但hover显然不起作用

请告诉我，如何使“hover”和“onclick/href”都能正常工作

这里有index.xhtml文件：

<ui:define name="content">
    <p:panelGrid columns="1"  style="display:block;" id="panel_home">
    <h:form id="department_form" style="display:none">
        <ui:repeat value="#{departamentsController.departments}" var="department" >
            <p:commandButton id="departmentButton" value="#{department.name}" oncomplete="PF('dialog').show();" styleClass="#{'department_'.concat(department.id)}" update="listFilesForm" actionListener="#{fileSearchController.filesByDepartment(department)}"/>
        </ui:repeat>
    </h:form>

    <h:graphicImage id="graphicImage1" ismap="true" styleClass="mapper iborder456c74 icolord76f47" url="/resources/images/mapa1.png" usemap="#map1" />
        <map name="map1" id="map1">
            <area href="JavaScript: document.getElementById('department_form:j_idt13:13:departmentButton').click();"  shape="poly" coords="434,166,438,162,439,158,445,148,450,137,456,134,458,126,461,121,466,120,470,119,476,121,493,89,505,85,515,82,526,80,536,73,547,63,539,47,529,44,524,42,522,40,517,40,514,41,514,45,510,45,509,43,507,46,503,48,502,46,498,49,501,52,499,55,494,58,492,57,492,53,485,52,484,54,483,59,483,64,477,76,467,81,453,85,444,88,436,95,423,103,418,106,410,113,394,115,390,122,389,128,388,136,392,140,398,139,406,139,412,141,410,148,413,150,418,146,421,149,423,153,423,159,420,165,419,169,427,165" />
            <area href="JavaScript: document.getElementById('department_form:j_idt13:14:departmentButton').click();" shape="poly" coords="371,260,377,254,369,244,368,239,363,232,357,227,365,222,373,220,375,221,377,218,366,198,360,188,369,172,376,170,384,167,390,163,395,163,393,158,391,152,392,148,390,143,388,139,394,113,386,114,378,113,372,111,368,107,361,107,358,110,353,115,352,120,352,123,349,132,344,142,342,146,335,145,334,142,327,142,327,139,333,137,333,131,328,126,318,124,316,126,318,131,319,141,320,150,320,158,315,163,310,170,308,176,305,182,305,186,312,188,314,195,311,198,309,202,312,210,313,216,315,220,313,226,320,232,329,243,336,240,339,243,344,243,351,252" />

        </map>
    </p:panelGrid>
</ui:define>

因此，无论我使用“href=”JavaScript:…”还是“onclick=”都不会改变。我搜索了很多地方，做了很多测试，但仍然不知道如何在区域上“悬停”和“onclick/href”都可以正常工作

我有大约30个区域，但你知道我只复制了两个

---

提前感谢您的帮助！

在区域标记中，最好使用onclick事件而不是href。当您有很多区域（例如地图）时，最好按类而不是按Id调用该操作。它还会显示以下事件，该事件将触发该操作，并且还会显示悬停效果：

    onclick="document.getElementsByClassName('nameofclasshere')[0].click();"

---

这对我来说非常有效……这要归功于Sergio Morales的回答：）

这个PrimeFaces是如何关联的？请创建一个。你会看到很可能没有PF标记了。这一切都是纯HTML/javascript（不是xhtml）问题谢谢你的回复@Kukeltje我会提醒你关于提问的最佳方式的话…关于我自己的问题，以防有人有类似的问题。一位朋友告诉我，在中的最佳实践是有onclick事件，而不是href。当你有很多（例如地图）时，最好按类而不是按Id调用该操作。他还向我显示以下将触发该操作的事件，并显示悬停效果：

onclick=“document.getElementsByClassName（'nameofclasshere'）[0]。单击（）；“

…感谢您的帮助：）请将问题改进为（a.o.删除所有PF内容，因为它完全不相关）