1

10個の要素をロードするページを作成し、ページの下部にクラシックボタン「さらにロード」を配置してさらに10個の要素をロードしました。

問題はjQueryにあり、：nth-​​child（）プロパティで指定されたスタイルは次の10個の要素では機能しません。

この問題を解決するための解決策はありますか？

例えば：

ファイルmain.js

$("#main_content > p:nth-child(3n+2)").addClass("small-product-wrapper");
$("#main_content > p:nth-child(3n+3)").addClass("small-product-wrapper");

ファイルexample.php

<script type="text/javascript">
  $('#more_button').click(function(){

    loaded_messages += 10;

    $('#loading').ajaxSend(function() {
      $("#loading").stop(true,true).fadeIn().delay(200).fadeOut();
    });

    var dati = "twitterpagination/get_messages/" + loaded_messages;
    $.ajax({
      url:'twitterpagination/get_messages/' + loaded_messages,
      type: 'get',
      data: dati,
      cache: false,
      success: function() {
    $.get(dati, function(data){
      $("#main_content").append(data);
    });

    if(loaded_messages >= num_messages - 10) {
      $("#more_button").hide();
    }
      },
      error: function() {
    // do nothing 
      }
    });
    return false;
  });
</script>

<div id="main">
  <?php
  foreach($latest_messages as $message) {
    echo '<p>'.$message->message .'</p>';
  }
  ?>
  <div id="more_button">more</div>
</div>

Ajax URLによってロードされたファイル：

<?php
  foreach($latest_messages as $message) {
    echo '<p>'.$message->message .'</p>';
  }
?>
4

3 に答える 3

1

新しいhtmlがAJAXから追加された直後に、これら2つのjQuery行を再実行する必要があります。

success: function() {
    $.get(dati, function(data){

        $("#main_content").append(data);
        // here
        $("#main_content > p:nth-child(3n+2)").addClass("small-product-wrapper");
        $("#main_content > p:nth-child(3n+3)").addClass("small-product-wrapper");
    });
}

これは、これらの元の行がページの読み込み時に1回だけ実行されるためです。

于 2012-12-10T15:58:57.610 に答える
1

ajaxによってロードされたファイル：

<?php
  foreach($latest_messages as $message) {
    echo '<p class="small-product-wrapper">'.$message->message .'</p>';
  }
?>

返されたPタグにスタイルを追加します

于 2012-12-10T16:00:03.980 に答える
0

Ajaxで新しいコンテンツをロードするとき、スタイルを自動的に割り当てる唯一の方法は、それにクラスを与え、そのクラススタイルをcssで定義することです。

そうしない場合は、ajax呼び出しのコールバック関数でスタイルを再度割り当てる必要があります。

于 2012-12-10T15:59:44.323 に答える