我在前端开发方面经验不足,尤其要提到Web ui不在我的星球上。

我需要在按钮的onClick事件上显示和隐藏元素的问题。
技术堆栈是带有PrimeFaces的JSF,对于我们使用JavaScript的脚本。

基本上-如何获得需要显示/隐藏的元素的引用?
而且您能给我一个线索,为什么评论中的行(下面)有效?

function test(id, id2){
    var element =$(document).get("#testEl");
    $(element).show(); //this doesn't work??? although I get no errors executing it..
    //  $("#tab-view\\:template-form\\:testEl").show();  // <-- however this works? Why?
    $(btn).css("display", "none");
}


的HTML:

 <p:commandButton widgetVar="edit" id="edit" value="Edit" onclick="test(this,    #testEl)" type="button"/>
      <p:panel widgetVar="opa" id="testEl" closable="false" visible="false"  >
      <h:panelGrid ..>....
</h:panelGrid>

</p:panel>


谢谢!

最佳答案

首先,检查此ID在生成的HTML中的外观,并将其用作基础。如果您试图从像formId:someId这样的JSF命名容器传递ID,则必须转义冒号,否则jQuery会将其视为伪选择器。根据经验,应该始终给容器ID命名,这样,当您看到JSF自动生成的ID并且不知道它们来自何处时,就可以避免混淆。在这种情况下,最简单的方法是在JS本身中对其进行转义。我过去在将转义ID传递给jQuery时遇到问题。因此,请设置您的onclick:

onclick="test(this, 'formId:testEl')";


然后在JS中:

function test(id, id2) {
   id2 = id2.replace(/:/g, "\\:");
   $("#" + id2).show();
}

09-11 01:48
查看更多