1

ajaxを使用してdiv内にページを読み込んでいます。-などの固定セレクターdivがある場合は、すべて正常に機能しています。

$('.ajaxurl').click(function(){
    $('.selected-blog').load($(this).attr('href'));
    return false;
});

ここで、「。selected-blog」は固定エントリです。

ただし、ページに複数の.ajaxurlリンクがあり、それぞれに独自の'.selected-blog' divがあるため、クリックされた.ajaxurlリンクに応じてソースを別のdivにロードできるようにします。つまり、各.ajaxurlリンクには対応する一意の.selected-blog- [id]クラスが必要であり、リンクをクリックすると、[id]変数を関数に渡して、セレクターに追加できるようにする必要があります。

.ajaxurlリンクに変数としてjqueryに渡すIDを指定してみたので、本文のコードは-

<div class="teaser-id<?php print $id; ?>">
  <a class="ajaxurl" id ="id<?php print $id; ?>" href="[pagelink]">Click me</a>  
  stuff here
</div> 
<div class="selected-blog-id<?php print $id; ?>"></div>     

[this above code repeats for each teaser in the list] 

そしてjqueryコードは-

$('.ajaxurl').click(function(){
     var x = this.id;
     $('.selected-blog-,'+x).load($(this).attr('href'));
     return false;
});

しかし、私はそれを機能させることができません、私は何が間違っているのですか?

(最後に-これは、ソリューションに影響がある場合の追加ポイントです-ティーザーを非表示にしたい-[id] divなので、渡された変数がこの.hide()関数にも使用できる場合素晴らしいことだ!)

どうすればいいですか?!

どうもありがとう!

4

3 に答える 3

1

HTMLをそれほど複雑にする必要はありません。シンプルに保ち、jquery next()selected-blog-idを使用して、コンテンツをロードするクラスで次のdivを取得できます。これらの線に沿った何かがあなたのために働くはずです:

HTML

<div class="teaser-id">
    <a class="ajaxurl" href="[pagelink]">Click me</a>  
    stuff here
</div> 
<div class="selected-blog-id"></div> 

Javascript

$('.ajaxurl').click(function(e) {
    var $parent = $(this).parent();

    // hide the teaser
    $parent.hide();

    // load content into the next div with selected-blog-id
    $parent.next('.selected-blog-id').load(this.href);
    e.preventDefault();
});
于 2012-08-27T12:35:44.630 に答える
0

ajaxurl要素をとして印刷していますが、代わりに印刷id ="id<?php print $id; ?>"するつもりでしたか?id ="<?php print $id; ?>"

于 2012-08-27T12:36:39.277 に答える
0

いくつかの入力ミスがあったようです。そうでない場合は、以下を再確認してください。

<div class="teaser-id-<?php print $id; ?>">
 <a class="ajaxurl" id ="blog-<?php print $id; ?>" href="[pagelink]">Click me</a>  
 <!-- <a class="ajaxurl" id ="id<?php print $id; ?>" href="[pagelink]">Click me</a> -->  
 stuff here
</div> 
<div class="selected-blog-<?php print $id; ?>"></div> 
<!-- <div class="selected-blog-id<?php print $id; ?>"></div> -->   

[this above code repeats for each teaser in the list] 

jQuery

$('.ajaxurl').click(function(){
    var x = this.id.replace("blog-", '');
    //$('.selected-blog-,'+x).load($(this).attr('href'));
    $('.selected-blog-' + x).load($(this).attr('href'), function(){
        $(".teaser-id-" + x).hide();
    });
    return false;
});

更新 コメントに基づいてこれを変更します...

$('.selected-blog-'+x).load($(this).attr('href'));
于 2012-08-27T12:40:05.843 に答える