1

私はhtmlコードを持っています:

<div>
  <span class="image" id="img-1"></span>
  <span id="src-1">img-src-1</span>
  <span id="cmd-1">img-cmd-1</span>
  <span id="h1-1">img-h1-1</span>
  <span id="h2-1">img-h2-1>
</div>

<div>
  <span class="image" id="img-2"></span>
  <span id="src-2">img-src-2</span>
  <span id="cmd-2">img-cmd-2</span>
  <span id="h1-2">img-h1-2</span>
  <span id="h2-2">img-h2-2>
</div>

その他、img-3、img-4、img-5 ..... などの div を増分し、関連する値を使用

これは私のJavaScriptです：

$('.image').each(function() {
  $.post("../../includes/processes/show-images.php", {
    width : $(this).parent().width(),
    img_src : $(this).next().text(),
    cmd : $(this).next().next().text(),
    h1 : $(this).next().next().next().text(),
    h2 : $(this).next().next().next().next().text()
  },
  function(response){
    $(this).parent().html(response);
  });
});
return false;

「.image」要素ごとにその値を投稿し、「.image」.parent() で応答を返したいのですが、コードが機能しません。:-(

誰か助けてくれませんか？

4

1 に答える 1

3

thisのコールバック関数のコンテキスト内のキーワードは$.post、クリックされた要素を参照していないため、オブジェクトをキャッシュします。

$('.image').each(function() {
   var $this = $(this);
   $.post("../../includes/processes/show-images.php", {
    // ...
   }, function(response){
       $this.parent().html(response);
   });
});

メソッドを数回呼び出す代わりに.siblings()andメソッドを使用することもできます。.eq().next()

$('.image').each(function() {
      var $this = $(this),
          $siblings = $this.siblings();
      $.post("../../includes/processes/show-images.php", {
          width   :  $this.parent().width(),
          img_src :  $siblings.eq(0).text(),
          cmd     :  $siblings.eq(1).text(),
          // ...
       }, function(response){
           $this.parent().html(response);
       });
});
于 2013-10-08T08:51:37.050 に答える