rel属性のリンクを動的にロードします。

Question

jqueryの​​機能を使用してコンテンツを動的にロードしたい。リンクの.rel属性にリンクを格納する。私はこのようにそれをセットアップを持っている：

<script> 
$(document).ready(function(){ 

$('.sidebar_link').click(function(){ 

    var link = this.attr('rel'); 
    event.preventDefault(); 
    $('#content').empty(); 
    $('#content').load(link '#content'); 

}); 
}); 
</script> 

<div class="main_menu"> 
<a class="sidebar_link" href="#" rel="photos.htm">Photography</a> 
<a class="sidebar_link" href="#" rel="furniture.htm">Furniture</a> 
<a class="sidebar_link" href="#" rel="services.htm">Services</a> 
</div> 
</div> 

そのが働いていない - それは、rel属性とイムなぜわからないの外にリンクをつかんされていないようです。何か案は？

Answer 1

これを試してください：あなたはjQueryの

そして、これとthisをラップする必要がありますので

var link = $(this).attr('rel'); 

.ATTRは、ネイティブのJavaScript関数ではありません、それはjQueryのからです：

$('#content').load(link); 

あなたはフラグメントをロードするためのIDを渡すことができますが、URLとIDは文字列リテラルである必要があります。$('#content').load('photos.htm #content') photos.htmページには要素が必要ですIDのコンテンツを持つページでページの内容全体を表示するだけの場合は、URLを使用してください。

Answer 2

$('#content').load(link '#content'); 

これはほぼ確実に構文エラーです。JavaScriptコンソールを確認してください。あなたはちょうど.load(link);がほしいと思う。

Answer 3

クリックハンドラーでthisは純粋なdom要素です。ただし、URLとIDがとても ` 'AJAX/test.htmlというような文字列リテラルである必要があり、あなたが断片をロードするためのIDを渡すことができ

$('#content').load($(this).attr("rel"));