1

AJAXを使用してデータベーステーブルを検索し、結果/検索候補をgoogle検索と同様のdivに配置する検索/テキストボックスがいくつかあります。現在、ページをリロードする以外に、これらのdivを空にする方法はありません。グーグル検索のようにテキストボックスを空白にするためにバックスペースを使用すると、divが空になるようにしたいと思います。現在、バックスペースを使用すると、「」を検索しているものとして扱われ、すべての結果が返されます。または、ボックスの外側をクリックして空にします。そうしないと、ページ上にdivがいっぱいになってしまい、混乱してしまいます。文字列が空の場合は何も返さないか、ボックスの外側をクリックするとボックスが空になるように、変更クエリを実行する必要があると考えています。提案をありがとう：

省略コードは次のとおりです。

Javascript

function getHints(str) {
...
document.getElementById("results").innerHTML=xmlhttp.responseText;//places output in results div
...
xmlhttp.open("GET","search.php?searchterm="+str,true);
xmlhttp.send();
}

html

<input type="text" id="search" onkeyup="getHints(this.value)">Search<div id="results"></div>

php

$str = $_REQUEST['str'];
$sql = "SELECT * FROM table WHERE name LIKE '%$str%'";
search database and echo out results.
4

2 に答える 2

3

jQueryを使用すると、このようなこと、AJAX、DOMの操作などを行うときに非常に役立ちます。

function getHints(str) {
    ...
    if (str === "")
    {
        document.getElementById("results").innerHTML = "";
    }
    else
    {
        document.getElementById("results").innerHTML=xmlhttp.responseText;
        ...
        xmlhttp.open("GET","search.php?searchterm="+str,true);
        xmlhttp.send();
    }
}
于 2012-10-25T11:10:30.553 に答える
1

空の文字列を確認し、それに応じて処理します。

function getHints(str) {
    if (str == "") {
        document.getElementsById("results").innerHTML = "";
    }
    else {
    ...
    }
}
于 2012-10-25T11:09:58.207 に答える