4

ここに画像の説明を入力

添付の写真は、私が構築している検索エンジンの結果ページを示しています。返された結果ごとに、ユーザーは結果 (つまり、「Food Science」) をクリックすると、アコーディオン スタイルで展開され、その特定の結果に関する情報が表示されます。

ユーザーが結果をクリックするたびに (学習/インテリジェンスの目的で) ログを記録し、作成したデータベース テーブルに保存します。このテーブルには、セッション ID、クエリ、結果の位置、および順序が格納されます。ユーザーがアイテムをクリックしました。

JQueryを使用して、クリックされた結果のタイトルを取得する関数が既にあり、クリックをログに記録する場所を設定していますが、JQueryはクライアント側でPHPであるため、その方法がわかりませんサーバー側です。

JQuery を使用して PHP 関数をトリガーし、データベースにクエリを実行してクリック ログをテーブルに挿入するにはどうすればよいですか?

以下はJQuery関数です。

$(document).ready(function() { 
    $('.accordionButton').click(function(e) {
        if($(this).next().is(':hidden') == true) {
            $(this).addClass('on');
            $(this).next().slideDown('normal');
            $(this).next().slideDown(test_accordion);
            // SEND CLICK ACTION TO LOG INTO THE DATABASE
            alert($(this).find('h3:last').text()); // displays the title of the result that was just clicked
         } 
         else {
            $(this).removeClass('on');
            $(this).next().slideUp('normal');
            $(this).next().slideUp(test_accordion);
         } 
     });
}
4

4 に答える 4

3

次のようなことができます (未テスト):

クリック関数の外で、クリックの順序を追跡する JavaScript 変数を定義します。

var order = 0;

これをクリック関数の下部に追加します。

order++;
var sessionID = $("input[name='sessionID']").val();  // assuming you have sessionID as the value of a hidden input
var query = $("#query").text();    // if 'query' is the id of your searchbox
var pos = $(this).index() + 1;     // might have to modify this to get correct index
$.post("logClick.php", {sessionID:sessionID, query:query, pos:pos, order:order});

「logClick.php」と呼ばれるphpスクリプト（同じディレクトリ内）：

<?php
    // GET AJAX POSTED DATA
    $str_sessionID = empty($_POST["sessionID"]) ? '' ; $_POST["sessionID"];
    $str_query = empty($_POST["query"]) ? '' ; $_POST["query"];
    $int_pos = empty($_POST["pos"]) ? 1 ; (int)$_POST["pos"];
    $int_order = empty($_POST["order"]) ? 1 ; (int)$_POST["order"];

    // CONNECT TO DATABASE
    if ($str_sessionID && $str_query) {
        require_once "dbconnect.php";    // include the commands used to connect to your database. Should define a variable $con as the mysql connection

        // INSERT INTO MYSQL DATABASE TABLE CALLED 'click_logs'
        $sql_query = "INSERT INTO click_logs (sessionID, query, pos, order) VALUES ('$str_sessionID', '$str_query', $int_pos, $int_order)";
        $res = mysql_query($sql_query, $con);
        if (!$res) die('Could not connect: ' . mysql_error());
        else echo "Click was logged.";
    }
    else echo "No data found to log!";
?>

スクリプトでエラーが発生したかどうかを確認したい場合は、 $.post() ajax メソッドの 3 番目のパラメーターとしてコールバック関数を追加できます。

$.post("logClick.php", {sessionID:sessionID, query:query, pos:pos, order:order},
    function(result) {
      $('#result').html(result);  // display script output into a div with id='result'
      // or just alert(result);
    })
);

編集:結果をページ分割したために、ページの読み込み間で順序変数の値を保持する必要がある場合は、GET または POST を使用してページ間でこの変数の値を渡すことができます。その後、非表示の入力に値を保存し、jQuery で簡単に読み取ることができます。(または、Cookie を使用することもできます)。

例 (これをすべての結果ページに入れます):

<?php
   $order = empty($_POST["order"]) ? $_POST["order"] : "0";
   $html="<form id='form_session' action='' name='form_session' method='POST'>
        <input type='hidden' name='order' value='$order'>
    </form>\n";
   echo $html;
?>

jQuery で、次のように変更var order = 0;します。

var order = $("input[name='order']").val();

次に、ユーザーがページ リンクをクリックしたときに、デフォルトのリンク アクションを防止し、順序値とフォーム アクションを設定してから、javascript/jQuery を使用してフォームを送信します。

$("a.next_page").click(function(event) {
  event.preventDefault();
  var url = $(this).attr("href");
  $("input[name='order']").val(order);
  $("#form_session").attr('action', url).submit();
});

すべての「次」および「前」のページネーション リンクには、同じクラス (つまり、「next_page」(この例では)) を指定する必要があります。

編集:ページネーションが次の場合:

<div class='pagination'>
    <ul><li><a href='page1.url'>1</a></li>
        <li><a href='page2.url'>2</a></li>
    </ul>
</div>

次に、これを変更します。

$("div.pagination a").click(function(event) {
etc.
于 2012-04-03T21:30:05.417 に答える
1

jQuery AJAX を使用して、PHP ページにリクエストを送信します。詳細については、こちらを参照してください (非常に簡単です)。

http://api.jquery.com/jQuery.ajax/

この特定のケースでは、何も返す必要がないため、jQuery で POST または GET メソッドを使用する方がよい場合があります。

http://api.jquery.com/jQuery.post/ http://api.jquery.com/jQuery.get/

何かのようなもの：

$.ajax({
  type: "POST",
  url: "some.php",
  data: "name=John&location=Boston"
  success: function(data){
     alert('done');
});
于 2012-04-03T20:51:30.927 に答える
1

これは非常に簡単です。検索ページから送信される AJAX リクエストを処理するには、PHP スクリプトが必要です。

検索ページでは、.ajax を追加してスクリプトへの AJAX リクエストを作成する必要があります。AJAX について知る必要があるすべての情報は、http: //api.jquery.com/jQuery.ajax/にあります。

PHP スクリプトで Database アクションを処理し、GET または POST データを使用してスクリプトに Ajax 経由の ID を与えます。

于 2012-04-03T20:52:41.023 に答える
1

Ajax を使用します。クリックをデータベースに書き込む単純な php スクリプトを作成します。クリックをデータベースに正確に記録する方法はわかりませんが、クリックされた項目の一意の識別子を ajax を使用して、たとえば POST 変数を介して PHP スクリプトに送信できます。

クリック時の小さな例：

$.post(
'count_click.php', 
{ id: "someid" },
function(data) {
// data = everything the php-script prints out
});

Php:

if (isset($_POST['id'])) {
// add a click in the database with this id
}
于 2012-04-03T20:55:25.890 に答える