2

私はjqueryを初めて使用し、これに関するヒントを喜んで入手します。リンクがいくつかあり、それらのコンテンツを#contentdivにロードしたいと思います。hrefを使用しないので、idをロードして.htmlを追加します（例：最初のリンクはid = "link1"を取得しました。クリックすると、link1.htmlを#content divにロードします）。さらに、クリックしたリンクのクラスを非アクティブからアクティブに切り替え、前のアクティブなリンクを見つけて、そのリンクを非アクティブに変更したいと思います。

だからこれは私が試したものです：

$(".link").click(function() {
    var linkHref = $(this).attr("id");
    var loadHref = linkHref.append(linkHref + ".html");
    $("#content").load(loadHref);
    $("#nav").find(".active").toggleClass("active inactive");
    $(this).children("a").toggleClass("inactive active");
});

HTML：

<ul id="nav">
    <li><a href="#" id="link1" class="active link">Link 1</a></li>
    <li><a href="#" id="link2" class="inactive link">Link 2</a></li>
    <li><a href="#" id="link3" class="inactive link">Link 3</a></li>
</ul>

出力：何も起こりません。

4

1 に答える 1

3

appendはjQueryオブジェクトのメソッドであり、メソッドattrを持たない文字列（Stringオブジェクト）を返します。文字append列を連結する場合は、+代わりに演算子を使用する必要があります。aまた、ハンドラーを要素liではなく要素にバインドしているため、を使用する必要がないことにも注意してくださいchildren。

var linkHref = $(this).attr("id") + '.html';


$(".link").click(function(e) {
    // Prevent the default action of the event
    e.preventDefault();
    var linkHref = this.id + '.html';
    $("#content").load(linkHref);
    $("#nav a.active").toggleClass('inactive active');
    $(this).addClass("active").removeClass('inactive');
});
于 2013-03-17T13:26:55.903 に答える