Question

我问了这个问题Is it possible to add a javascript function to a h:form in jsf2?，但它已作为重复内容关闭，并附有此https://stackoverflow.com/a/29129816/4142984答案的链接。

也许在我的问题中，我没有说清楚我想做什么：我想要一个复合材料，其内部结构可能会在未来的版本中发生变化。我希望这个复合函数有一个javascript函数，可以从外部调用来处理所有内部细节，封装在复合中，而不包含任何代码部分。

<h:form onload="this.myfunc=function(){alert('Hello world');}" ...

可以做到这一点，但h：form没有“onload”。

这样，当复合结构发生变化时，不需要更改使用复合的页面。

假设的答案分为两部分。标有“2.）”的部分根本不解决我的问题，因为它需要复合之外的javascript。

标有“1.）”的部分看起来更好，但我不能让它起作用。

我将以下内容放在我的复合形式的h：形式中：

<h:outputScript>alert("Now"+this+'#{cc.attrs.imgId}');window.document.getElementById('#[cc.attrs.imgId}').myfunc=function() {alert("newly called"+#{mBean.keyX})}</h:outputScript>

但这失败了。首先，“ this ”是窗口，而不是我的“形式”。其次， getElementById 找不到该元素，显然是因为jsf更改了id。

那么我该怎么做才能让它发挥作用？

编辑：感谢提示和答案，以下代码有效：

<composite:implementation>
    <h:form id="${cc.attrs.imgId}" styleClass="small">
        <f:event type="postAddToView" listener="#{mBean.register}" />
        <f:attribute name="myId" value="hmta${cc.attrs.imgId}" />
        <h:graphicImage width="${cc.attrs.width}" id="${cc.attrs.imgId}"
            onclick="this.nextSibling.value=mods(event)" onmouseover="aa=this.id"
            value="images/img?#{cc.attrs.flav}=#{Math.random()}">
            <f:ajax event="click" execute="@this k"
                listener="#{mBean.handleEvent}" render="@this">
            </f:ajax>
        </h:graphicImage>
        <h:inputHidden id="k" value="#{mBean.keyX}" />
    </h:form>
    <h:outputScript>window.document.getElementById('#{cc.clientId}:#{cc.attrs.imgId}').myfunc=function() {alert("newly called"+#{mBean.keyX})};</h:outputScript>
</composite:implementation>

Answer 1

第一

通过提供ID来调用复合组件：

<core:yourComposite id="someId" .../>

第二

您在h：form属性中添加prependId=false以防止自动ID并为该表单提供id

现在你检查渲染的html，你将看到带有映射语义id的表单，如：someId:formId现在你可以在调用表单中注入你的脚本：

通常

getElementById('#{cc.attrs.id}:formId')

使用jsf-2将javascript代码封装在复合内部

1 个答案: