0

以下を出力するページがあります

これは私のテンプレートのhtmlです

<ul id="process"><span>Process: </span>

これは私の縮小されたJavascript（functions.js）です

$(window).load(function () {
    var a = $("#slider").children("img");
    currentIndex = 0;
    slideCount = a.length;
    fadeDuration = 1E3;
    navigation = $("#process");
    navCnt = 0;
    navNumFix = 1;
    for (i = 0; i < slideCount; i++) navigation.append('<li><a href="#" class="navItem" data="' + navCnt+++'">' + navNumFix+++"</a></li>&#32;");
    $(".navItem").click(function () {
        var b = $(this).attr("data"),
            c = currentIndex;
        currentIndex = b;
        c != currentIndex && ($(a[c]).fadeOut(fadeDuration), $(a[currentIndex]).fadeIn(fadeDuration))
    })
});

私のスライダーの場合、これはすべてulタグを出力し、次のようにJavascriptを介してリストアイテムを添付します。

<ul id="process"><span>Process: </span>
<li><a href="#" class="navItem" data="0">1</a></li>
<li><a href="#" class="navItem" data="1">2</a></li> 
</ul>

テンプレートにulタグを出力する代わりに、スクリプトがulタグを要求した場合にのみulタグを出力するにはどうすればよいですか？上記のリスト項目のようなものです。

4

1 に答える 1

1

これでうまくいくはずです...最初はテンプレートを表示せず、リスト要素を追加した後に表示します。

<ul style="display:none" id="process"><span>Process: </span></ul>

Javascript：

$(window).load(function () {
    var a = $("#slider").children("img");
    currentIndex = 0;
    slideCount = a.length;
    fadeDuration = 1E3;
    navigation = $("#process");
    navCnt = 0;
    navNumFix = 1;
    for (i = 0; i < slideCount; i++) navigation.append('<li><a href="#" class="navItem" data="' + navCnt+++'">' + navNumFix+++"</a></li>&#32;");
    $(".navItem").click(function () {
        var b = $(this).attr("data"),
            c = currentIndex;
        currentIndex = b;
        c != currentIndex && ($(a[c]).fadeOut(fadeDuration), $(a[currentIndex]).fadeIn(fadeDuration))
    })

    // Display the ul if there are slides
    if(slideCount > 0)
       navigation.show();
});

編集：スライドがある場合にのみulを表示する条件を追加しました

于 2012-09-22T03:32:29.857 に答える