Question

我在页面上有以下JQuery。

$("." + clazz).on("mousedown", function() {
    $(this).removeClass(clazz);
    $(this).addClass(clazzPressed);
});
$("." + clazz).on("mouseup", function() {
    $(this).removeClass("clazzPressed");
    $(this).addClass("clazz");
    setCookie('cmpaid',$(this).attr('id'),1);
    divClickAction();
});

这对我来说很好。但是，我使用一些AJax并在页面上更新某些东西。一个更新发生，此代码不再有效。

我怀疑它只与页面加载时调用有关。一旦我更新我的页面，新的东西不知道它。有没有办法更新新东西以获得这个JQuery代码？

如果重要，这是通过Ajax更新的代码：

<h:panelGroup id="urlList"  >
                <script src="/resources/scripts/divClick.js"/>
            <script src="/resources/scripts/cookie.js"/>
                <ui:repeat id="urlRepeater" value="#{uRLManagerManagedBean.urls}" var="url" >
                    <div id="#{url.id_value.toString()}" class="divClick" style="margin-bottom: 10px;margin-left: 15px;">            
                        <div style="float:right;">
                            <p:outputLabel value="#{url.category.category}" /><br/>
                            <p:outputLabel value="Embedded" rendered="#{url.isEmbedded}"/>
                        </div>
                        <p:graphicImage value="#{streamedContentManagedBean.image}"  styleClass="urlImageSize" style="float: left;min-width: 25px;"> 
                            <f:param name="id" value="#{url.image.idAsString}" />
                        </p:graphicImage>
                        <h:panelGrid columns="1" >
                            <p:outputLabel value="#{url.name}" />
                            <p:outputLabel value="#{url.url}" rendered="#{not url.isEmbedded}" />  
                            <p:outputLabel value="#{url.embed.url}" rendered="#{url.isEmbedded}" /> 
                            <p:outputLabel value="#{url.type.toString(url.type)}" />
                            <h:outputText value="#{url.description}" escape="false"/> 
                        </h:panelGrid>
                    </div>
                </ui:repeat>

                <h:panelGroup layout="block" class="cardBody" style="margin-bottom: 10px;margin-left: 15px;padding:10px 10px 10px 10px;" rendered="#{empty uRLManagerManagedBean.urls}" >
                    <h:outputLabel value="No Urls" style="font-size: 25px;color: white;"/>
                </h:panelGroup>
            </h:panelGroup>

它是JSF，稍后会被某些代码更新。但是这个问题应该与此无关。

Answer 1

将您的javascript代码放在一个函数中，然后在页面加载时调用该函数。

然后在页面上为preRenderView事件注册一个监听器：

<f:metadata>
    <f:event type="preRenderView" listener="#{backingBean.preRenderViewListener}"/>
</f:metadata>

在监听器方法中：

public void preRenderViewListener()
{
    RequestContext.getCurrentInstance().execute("someJavaScriptFunction()");
}

每次ajax请求后都会再次调用JavaScript。

JQuery适用于页面加载，但不适用于页面加载

1 个答案: