Javascript 任何不使用a4j:ajax的滑块?

Javascript 任何不使用a4j:ajax的滑块?,javascript,ajax,jsf,anythingslider,Javascript,Ajax,Jsf,Anythingslider,我尝试使用Anythingslider在div之间滑动: <h:panelGroup id="preview" layout="block" style="float: left; margin-left: 100px;"> <ul id="slider"> <li><ui:include src="./preview/WelcomePreview.xhtml" /></li&

我尝试使用Anythingslider在div之间滑动:

    <h:panelGroup id="preview" layout="block"
        style="float: left; margin-left: 100px;">

        <ul id="slider">
            <li><ui:include src="./preview/WelcomePreview.xhtml" /></li>
            <li><ui:include src="./preview/CardPreview.xhtml" /></li>
        </ul>

    </h:panelGroup>

但一旦我在网站中加入一个表,它就不再有效了。请注意,我没有将表包括在div中,而是将表包括在滑块中!这不在名单上。可能不是表格导致了错误

这是我尝试包含的html:

<rich:collapsiblePanel header="Title" switchType="client"
    expanded="false">

    <table style="table-layout: fixed;">
        <h:form>

            <tr>
                <td class="firstTD"><h:outputLabel value="Title: " /></td>
                <td><h:inputText id="title"
                        value="#{skinningBean.currentSkin.title}">
                        <a4j:ajax event="keyup" render="preview" />
                    </h:inputText></td>
            </tr>
        </h:form>
    </table>
</rich:collapsiblePanel>

编辑

我已经发现,这行代码会产生错误:

    <a4j:ajax event="keyup" render="titlePreview" />

在使用ajax时,有没有办法使它正常工作

编辑

为了避免找不到正确的javascript函数,我做的第一件事是添加jQuery noConflict标记:

<script type="text/javascript">
    var $jq = jQuery.noConflict();
  $jq(function($){
  $('#slider1').anythingSlider();
});
</script>

var$jq=jQuery.noConflict();
$jq(函数($){
$('#slider1')。anythingSlider();
});
现在我唯一的问题是,一旦页面上呈现了一些东西,javascript就不再工作了。我猜这是因为javascript只是在页面初始化时加载的。由于性能原因,渲染没有加载整个页面?

未正确设置。应在文档准备功能之外执行,如下所示:

var $jq = jQuery.noConflict();
$jq(function($){
  $('#slider1').anythingSlider();
});
<a4j:ajax event="keyup" render="preview" oncomplete="initSlider()" />

我以前从未使用过a4j,但从文档中快速查看,我认为需要使用
oncomplete
属性来重新初始化滑块。试着这样做:

var $jq = jQuery.noConflict();
$jq(function($){
  $('#slider1').anythingSlider();
});
<a4j:ajax event="keyup" render="preview" oncomplete="initSlider()" />

正如我所说,我对使用a4j一无所知,但这看起来可能有用。

该更新仍然不正确。您正在使用
$
而不是
jQuery
调用documentready函数。调用
noConflict()
后,
$
的值将替换为以前的值(未定义或其他库)。请注意,在我的回答中,函数有一个参数,它是一个
$
,是jQuery,可以在闭包内自由使用。好的,谢谢:)但是它不会改变任何关于在呈现某些内容后将滑块转换回简单列表的内容。我想我找不到一种方法让它使用javascript工具嘿,谢谢你,实际上这正是我现在想要实现的。看看这个:好的,哇。。。你的代码有效,我的代码无效:D非常感谢。这也是我第二个问题的答案;)我看到的唯一区别是
事件
属性。。。我复制了上面的
“keyup”
示例,在另一个问题中我看到了
“change”