0

jquery+phpでネームタガーを作ろうとしています。私は PHP 部分を完了し、jquery コードは 99% 完了しましたが、'@' 記号の後に検索する文字列を渡すことが問題です。現在、contentEditable を true に設定した div を使用しています。コンソールログに表示されているものから、name 変数は実際には @+search 文字列ですが、リスト div は入力されません。スクリプトを手動で実行してデバッグしようとしたところ、name 変数を特定の 1 文字に設定するなど、機能しました。リスト div にデータを入力します。ヒントや提案は、以下の私のコードに感謝します:

$("#chat-message").bind("keyup", function (event) {
    //auto name complete
    var search = $(this).text();
    var searchbox = search.split(search.indexOf('@') + 1);
    var checker = search.substr(search.length - 1); //Checks last charcter inserted if its '@'
    var name = search.match(/@(\w+)/ig);
    console.log(name);
    var dataString = 'searchword=' + name + '&search=yes';
    if (name == '' || checker == " ") {
        $("#display-search").hide();
    } else if (checker === "@") {
        $.ajax({
            type: "POST",
            url: "searchy.php",
            data: dataString,
            cache: false,
            success: function (html) {
                $("#display-search").html(html).show();
            }
        });
    }
    return false;
});
4

1 に答える 1

1

ajax呼び出しを次のように変更してみてください。

$.ajax({
    "type": "POST",
    "url": "searchy.php",
    "data": {
        "searchword": name,
        "search": "yes"
    },
    "cache": false,
    "error": function (jqXHR, textStatus, errorThrown) {
        // log error to browser console
        console.log(textStatus + ': ' + errorThrown);
    },
    "success": function (data, textStatus, jqXHR) {
        console.log(data);
        $("#display-search").html(data).show();
    }
});

コンソールには何が表示されますか?

アップデート

何も表示されない場合は、AJAX が呼び出されていません。コンソール ログを試して、checker実際に等しいことを確認してください'@'。

アップデート：

ロジックで発生する根本的な問題は、AJAX 関数がchecker === '@'. ユーザーcheckerが最後に入力した文字のようnameに、checker === '@'.

代わりに、次のロジックをお勧めします。

$(document).ready(function () {
    'use strict';
    var ajaxIsActivelyPosting = false, // flag to prevent a post on every keyup
        searchForTerm = function searchForTerm(e) {
            //auto name complete
            var search = $(this).text(), //get the text
                matches = search.match(/@(\w+)\s?/ig), // get any matches
                name = matches ? matches : ''; // if there are matches, set the name
            if (name && !ajaxIsActivelyPosting) { // if there's a match, name will be truthy
                $.ajax({
                    "type": "POST",
                    "url": "searchy.php",
                    "data": {
                        "searchword": name,
                        "search": "yes"
                    },
                    "cache": false,
                    "beforeSend": function (jqXHR, settings) {
                        ajaxIsActivelyPosting = true; //set the flag
                    },
                    "complete": function (jqXHR, textStatus) {
                        ajaxIsActivelyPosting = false; //clear the flag
                    },
                    "error": function (jqXHR, textStatus, errorThrown) {
                        // log error to browser console, always helpful to have
                        console.log(textStatus + ': ' + errorThrown);
                    },
                    "success": function (data, textStatus, jqXHR) {
                        console.log(data); //see raw result in browser console
                        $("#display-search").html(data).show();
                    }
                });
            } else {
                $('#display-search').hide();
            }
            return false;
        };
    $('#chat-message').bind('keyup', searchForTerm);
});
于 2013-01-12T06:17:07.033 に答える