0

単純な関数を作成しようとしていますが、何か問題があります。hrefをクリックするとページがジャンプし、関数が失敗します。フィドル： http： //jsfiddle.net/XkzUK/5/

HTML：

<nav>
<ul id="site-nav">
    <li class="nav1"><a href="#recent">Recent</a></li>
    <li class="nav2"><a href="#highlights">Highlights</a></li>
    <li class="nav3"><a href="#animals">Animals</a></li>
    <li class="nav4"><a href="#cars">Cars</a></li>
</ul>
</nav>
<div id="content-listing">
    <div id="recent">
        <ul class="top-level">
        </ul>
    </div>
    <!--end recent-->
    <div id="highlights">
        <ul class="top-level">
        </ul>
    </div>
    <!--end highlights-->
    <div id="animals">
        <ul class="top-level">
        </ul>
    </div>
    <!--end animals-->
    <div id="cars">
        <ul class="top-level">
        </ul>
    </div>
    <!--end cars-->
</div>
<!--end content-listing-->

JS：

var test1;
var test2;
var test3;
var test4;

function switcher(divToShow, thisVar, otherVar, ajaxContent) {
    $("#site-nav li a").parents().removeClass("nav-active");
    $(this).addClass("nav-active");
    if(otherVar) {
        otherVar.detach();
    }

    if(typeof thisVar === 'undefined') {
        thisVar = $(divToShow + "ul.top-level").load('/echo/html/', {
            html: ajaxContent
        }, function () {
            alert("I'm new");
        });
    } else {
        thisVar.appendTo("#content-listing");
        alert("I'm old");
    }
}

//Recent
$("#site-nav .nav1").on("click", function (event) {
    switcher("#recent", "test1", "test2", "<li>1</li> <li>2</li> <li>3</li>");
    event.preventDefault();
});

//Highlights
$("#site-nav .nav2").on("click", function (event) {
    switcher("#recent", "test2", "test1", "<li>A</li> <li>B</li> <li>C</li>");
    event.preventDefault();
});​​

http://jsfiddle.net/XkzUK/5/

4

2 に答える 2

1

エラーが発生しました

otherVar.detach()

otherVarは単なる文字列であるため、機能.detach()せず、.detach()jQueryオブジェクトを受け入れます。

したがって、正しい形式は

$(otherVar).detach();

于 2012-05-31T17:56:50.833 に答える
0

これらすべてのパラメータとして文字列を渡します。したがって、これらのメソッドは文字列に存在しないため、の
ようなメソッドを呼び出すdetach()か、エラーをスローします。appendTo()

jQueryオブジェクトを渡す必要があります。

于 2012-05-31T17:55:35.030 に答える