3

データベースから複数の行を取得する for each ループを作成しました。プルする各行には、リンクと、値が posted_id の非表示の入力ボックスがあります。このリンクは、Facebook の「いいね」ボタンと同じように機能します。非表示の入力ボックスには、posting_id が格納されるだけです。「いいね」リンクをクリックすると、posting_id が jQuery ページに送信され、コミュニティと呼ばれるページに ping が返されて、ユーザーが投稿に「いいね」したことが通知されます。

ここに問題があります

いくつかの行をプルしていますが、「いいね」ボタンをクリックすると、プルされている一番上の行だけが実際にデータを jQuery ページに送信しているようです。一番上のボタン以外の「いいね」ボタンをクリックしても、まったく機能しません。

Jqueryページ

$('.bump_link').click(function(){ 
    var posting_id = $('.posting_id').val();    
    $.post("community.php", {
        posting_id: posting_id
    });
    alert(posting_id);
    $(this).toggleClass("bumped"); 
});

Foreach ループ

foreach ($result as $value) {
    $group_postings .= '
    <input type="text" class="posting_id" value="'.$value['posting_id'].'"> 
    <div id="bump_icon" class="bump_link"></div>
    <span id="counter"></span>
    ';
}

問題を明確にしたことを願っています。説明するのは困難でした。

4

5 に答える 5

2

問題は、すべての隠しフィールドが同じクラスを持ち、どのボタンをクリックしても最初の要素の値だけが渡されるため、クラスを使用してposting_idを取得していることです。

非表示の入力なしで、このhtmlを使用して、値をデータ属性として渡すことをお勧めします

<div id="bump_icon" class="bump_link" data-postid="'.$value['posting_id'].'">

この js で、 data 属性から投稿 ID を取得します

$('.bump_link').click(function(){ 
   var posting_id = $(this).data('postid'); // get the posting id from data attribute
   $.post("community.php", {
       posting_id: posting_id
   });
   alert(posting_id);
   $(this).toggleClass("bumped"); 
});
于 2013-03-27T11:47:02.677 に答える
1

val()複数の要素を返す可能性があるセレクターを呼び出していval()ますが、1 つの (最初の) 要素のみの値を返します。map()を使用して、クラスを持つ入力のすべての値を取得できますposting_id

var posting_id_values = $('.posting_id').map(function(){
       return this.value;
}).get().join(',');
于 2013-03-27T11:38:34.367 に答える
1

あなたの問題はこの行です：

var posting_id = $('.posting_id').val();

これは、クリックしているbump_linkに関連付けられたものではなく、毎回最初のposting_id値を返します。

これを解決する方法はたくさんあります。1 つの方法は、前の要素を選択するために .prev() を使用することです。

var posting_id = $(this).prev('.posting_id').val();

これにより、現在の div から前の shipping_id 要素が選択されます。これは、関連するbump_link divの前にposting_id要素があるという事実に依存しています。

于 2013-03-27T11:42:05.920 に答える
0

クリックしたボタンだけを送信したい場合はposting_id、PHP/HTML コードを次のように変更できます。

foreach ($result as $value) {
    $group_postings .= '
    <div id="bump_icon" class="bump_link">
    <input type="text" class="posting_id" value="'.$value['posting_id'].'"> 
    </div>
    <span id="counter"></span>
    ';
}

そして、次のようなJSコード：

$('.bump_link').click(function(){ 
    var posting_id = $(this).find('.posting_id').val();    
    $.post("community.php", {
        posting_id: posting_id
    });
    alert(posting_id);
    $(this).toggleClass("bumped"); 
});
于 2013-03-27T11:41:41.707 に答える
0

onコンテンツを動的に追加しているため、委任されたイベントを使用し、

$(this).prev('.posting_id') // to get the posting data value

$(document).on('click','.bump_link',function(){ 
  var posting_id = $(this).prev('.posting_id').val(); //<-- use $(this)  reference 
  $.post("community.php", {
      posting_id: posting_id
  });
 alert(posting_id);
 $(this).toggleClass("bumped"); 
});
于 2013-03-27T11:43:11.077 に答える