0

ユーザーがドロップダウンメニューから値を選択し、データベースからの情報が返される、データベース駆動型のWebサイトを構築しようとしています。ページを更新したくないので、ajax投稿を使用します：

$("#button").click(function(){ 
   var datastr = ($('#act').val());
   var datastr1 = ($('#loc').val());

   $.ajax({
      type:'POST',
      url:'activities_code.php',
      data: {datastr:datastr, datastr1:datastr1},
      success:function(response){
                $("#msg").html(response);                       
            } });});

urlパラメーターには、次のphpファイルがあります（これはphpファイルの一部です）。 

 $query = "SELECT PK,title,Information from activities where Activities='$category'";
    $result = mysqli_query($dbcon, $query) or die('no available data');

    echo "<table>";
$num_results = 0;
$t = 0; //title counter for the id of each title
while ($row=mysqli_fetch_array($result, MYSQLI_ASSOC)) {
     // Here the columns of title and information are printed
     echo "<tr><td>";
     echo "<a href='test.php'  id=\"t\".$t onClick=\"test()\" target=\"_new\" >".$row['title']."</a>"; 
     echo "<br>";
     echo  $x = $row['PK'];
     echo "</td></tr>";


     echo "<tr><td>";
     echo $row['Information'];
     echo "</td></tr>";
// Here I sum up the number of the results
     $num_results=$num_results+1;   
     $t = $t+1;      
 }

}

ご覧のとおり、IDを持つリンクがリンクされるたびにエコーするwhileループがあります。

"<a href='test.php'  id=\"t\".$t onClick=\"test()\" target=\"_new\" >".$row['title']."</a>";

私がやりたいのは、次のようにして、コードの後半で各リンクのこのIDを使用することです。

  document.getElementById("t1").value

私の質問は、このIDをクライアント側に返すにはどうすればよいですか？成功関数に何かを書くべきだと思いますが、何がわからないのです。コードの一部がわからない場合、またはすべてを明確に説明しなかった場合は、私に聞いてください。ありがとう。

これは、success関数でalert（response）したときに得られるものです。

<!DOCTYPE HTML>




       <table id="container"><tr><td><a href='test.php' id="t0" target="_new"   class='pickanchor'>Rafting in Voidomatis</a><br>1</td></tr><tr><td>
      <img src="m.jpg" class="textwrap" height="120px" width="120px">
      <p style="text-align:left;">Our experienced rafting instructors will show you the best way to enjoy Voidomatis, the river with the most clear waters inSouth Europe. You can also cross the Vikos Gorge by following Voidomatis river in an attractive one and a half hour   long walk. Alternatively you can ask for the more demanding Aoos river rafting.</p>
     <br>
     <br>
     <hr></td></tr><tr><td><a href='test.php' id="t1" target="_new" class='pickanchor'>Rafting   in Lousios</a><br>4</td></tr><tr><td><img src="raf.jpg" class="textwrap" height="120" width="120">
     <p>You will be surprised to know that Greece hides numerous, densely vegetated rivers offering amazing rafting opportunities. In the whole mainland, there is a company base awaiting you, for an amazing � off the beaten track experience!</p>
     <br>
     <br>
     <br>
     <hr></td></tr><div id="r2" align="center" id="result_2">2 results for rafting were found!        
     </div></table>  <!-- End of PHP code-->
4

4 に答える 4

1

あなたが提示した行で、あなたは間違いを犯しました。間違った場所に「.

echo "<a href='test.php'  id=\"t\".$t onClick=\"test()\" target=\"_new\" >".$row['title']."</a>";

そのはず

echo "<a href='test.php'  id=\"t".$t."\" onClick=\"test()\" target=\"_new\" >".$row['title']."</a>";

while ループの後に追加できる最も簡単な解決策として

echo "<script> my_max_id_num=$t </script>"

これにより、どの ID がページに存在するかがわかります。これにより、js スクリプトが my_max_id_num 変数にアクセスできるようになります。これはプログラミングのベスト プラクティスとは見なされませんが、単純です。

問題を解決する 2 番目の (より良い) 方法は、html の代わりに json を返し、success メソッドを書き直すことです。これには、さらに多くの作業が必要になります。

  1. 次のような値を返すように while ループを書き直します。

    { "data":[
    ...
    { "id":"10", "target":"_new", "title":"one_of_your_link_titles" },
    { "id":"10", "target":"_new ", "title":"one_of_your_link_titles" },
    ...
    ]}

  2. jsonを受け入れるようにajaxクエリを書き直し、サーバーから返されたデータに基づいてリンクを作成するようにsuccessメソッドを書き直します。

このようにして、ID とリンクの両方を 1 つのクエリに含めることができます。さらに、要件を変更する場合は、より簡単になります。

于 2012-10-07T13:05:06.503 に答える
1

まず、アンカータグのIDに問題があります。ここに訂正があります

"<a href='test.php'  id=\"t".$t."\" onClick=\"test()\" target=\"_new\" >".$row['title']."</a>";

次に、次のようにテーブルにIDを付けます

<table id="container">

3 番目に、アンカー タグにクラスを与えます。

"<a href='test.php' class='pickanchor'  id=\"t.$t\" onClick=\"test()\" target=\"_new\" >".$row['title']."</a>";

.html() ステートメントの後に、成功ハンドルに次のコードを記述します。

新しい編集

$("a.pickanchor").each(function(i){

   alert(this.id);
});
于 2012-10-07T13:05:36.403 に答える
0

説明を求めるのに十分な担当者がいませんが、「この ID をクライアント側に返す」とはどういう意味ですか? また、要素「t1」の「値」は何でしょうか?

リンクの場所を取得したい場合は、次のようになります。

var value = $('#addButton').attr('href');

次に、値を使用して何かを行います（「このIDをクライアント側に返す」とはどういう意味かわかりません）が、おそらく値をクライアントに表示したいですか？

したがって、表示したいページのどこかに div がある場合は、次のような値を入力できます。

HTML <div id="valueBox"></div>

jQuery

$("#valueBox").html(value);
于 2012-10-07T13:11:28.043 に答える
0

最も簡単な解決策は、要素に を与えるclassことです。これにより、要素に基づいて選択する必要がなくなりますidが、簡単にアクセスできます。

例えば。

<a href="#" id="t0" class="className">test 0</a>
<a href="#" id="t1" class="className">test 1</a>

$('#msg').on('click', '.className', function() {
  console.log(this.id);
});
于 2012-10-07T13:02:03.903 に答える