Jsf 获取组件的坐标

如何在onclick事件之后获得JSF组件的坐标？我需要在单击的图标下方放置一个覆盖图

---

JSF是否提供了这样的内置功能，而不是手动编写javascript函数？

不，没有。该位置取决于浏览器（客户端）。在客户端，也完全没有JSF，它只是简单的HTML/CSS/JS。该位置只能从HTML DOM元素中提取。您必须将它从JS传递到JSF，或者完全用JS而不是JSF来完成业务工作

正如jQuery附带的PrimeFaces一样，检索相对于文档的元素位置的最佳方法是使用

---

我建议使用JSF组件库，如RichFaces或IceFaces。它们中的许多都具有AJAX功能和JavaScript库集成，因此具有用于执行这类操作的组件。

除了BalusC的回答之外，下面是一个示例，单击带有

id=placeholder

（可能是链接或按钮）的组件将打开另一个组件（

id=menu

）在触发组件的正下方。如果将鼠标移离触发组件，菜单将消失：

<script type="text/javascript">
jQuery(document).ready(function() {
  jQuery("#placeholder").click(function(event) {
    //get the position of the placeholder element
    var pos = jQuery(this).offset();
    var height = jQuery(this).height();
    //show the menu directly below the placeholder
    jQuery("#menu").css( { "left": pos.left + "px", "top": (pos.top + height) + "px" } );
    jQuery("#menu").show();
  });
  // hide the menu on mouseout
  jQuery("#placeholder").mouseout(function(event) {
    jQuery("#menu").hide();
  });
});
</script>

确保jQuery id选择器获取组件的正确id。例如，如果您的元素位于

id=form1

的表单中，jQuery调用必须如下所示：

  jQuery("#form1\\:placeholder").click(function(event) 

---

请注意双反斜杠。

我对这个也不太熟悉。但是，如果您发现一个库可以满足您的要求，那么没有任何技术因素可以阻止您添加更多库。它们应该很好地结合在一起。你应该回顾一下服务器端（JSF）和客户端技术（javascript）的区别。

<h:panelGroup style="position: absolute; display: none;" id="menu">
  <!-- content here -->                
</h:panelGroup>

  jQuery("#form1\\:placeholder").click(function(event)