0

入力にオートコンプリートを実装する方法を説明するビデオに参加しました。最後に、Firefox と chrome でテストしましたが、Internet Explorer を除いてうまく動作します。以下のコードは次のとおりです。

jquery:

function getSuggestions(value){
        if(value!=''){  
                $.get('suggest.php', {requestKword:value}, function (data){
                            $('#suggestions').show();
                            $('#suggestions').html(data);
                            doCSS();
                    });
        }
        else{
            removeSuggestions();
        }
}
function removeSuggestions(){
    $("#suggestions").html("");
    undoCSS();
}   
function fill(thisValue) {
    $('#ii').val(thisValue);
    setTimeout("$('#suggestions').hide();", 200);
}
function doCSS(){
$("#suggestions").css({
    'border' : 'solid',
    'border-width':'1px',
    'position': 'relative'
    });
}
function undoCSS(){
$("#suggestions").css({
    'border' : '',
    'border-width':''
    });
}
function addText(value){
        $("#ii").val(value);
}

css:

#suggestions{
text-align:left;
padding-left:5px;
font-size:14px;
}
#link:hover{ background-color:#f0f0f0; cursor:default;}

html :

<form action="/" method="get" id="set" name="set">
<input id="ii" type="text" name="q" size="96px"  value=""  onblur="fill();"  onkeyup="getSuggestions(this.value)"  /><br />
<div id="suggestions"></div>
</form>

mysql：suggest.php

mysql_connect('localhost', 'root', '');
mysql_select_db('keywords') or die (mysql_error());
$keyword=mysql_real_escape_string($_GET['requestKword']);
$result = mysql_query("SELECT * FROM `table`.`keys` where `column` like '$keyword%' LIMIT 0 , 10") or die (mysql_error());
while($row = mysql_fetch_assoc($result)){
    echo '<div id="link" onclick="addText(\''.$row['keyword'].'\')" ">'.$row['keyword'].'</div>';
}
4

3 に答える 3

0

これがあなたのために働くかどうか見てください...

次の行を jQuery コードに追加します。

$("#ii").keyup(function() {
  getSuggestions(this.value);
});

$("#ii").blur(function(){
  fill();
});

次の HTML 行を置き換えます。

<input id="ii" type="text" name="q" size="96px"  value=""  onblur="fill();"  onkeyup="getSuggestions(this.value)"  /><br />

と：

<input id="ii" type="text" name="q" size="96px"  value="" /><br />
于 2012-10-21T13:12:35.023 に答える
0

ここで jQuery オートコンプリート プラグインを検討することをお勧めします: http://jqueryui.com/autocomplete/。うまく動作するデモがあります。チップ ....

于 2012-10-21T22:22:40.580 に答える
0

最終的に私は解決策を見つけました、それは非常に簡単です:

私はPHPコードにいくつかのソードを追加します:

前 ：

mysql_connect('localhost', 'root', '');
mysql_select_db('keywords') or die (mysql_error());
$keyword=mysql_real_escape_string($_GET['requestKword']);
$result = mysql_query("SELECT * FROM `table`.`keys` where `column` like '$keyword%' LIMIT 0 , 10") or die (mysql_error());
while($row = mysql_fetch_assoc($result)){
echo '<div id="link" onclick="addText(\''.$row['keyword'].'\')" ">'.$row['keyword'].'</div>';
}

後 ：

mysql_connect('localhost', 'root', '');
mysql_select_db('keywords') or die (mysql_error());
$keyword=mysql_real_escape_string($_GET['requestKword']);
$result = mysql_query("SELECT * FROM `table`.`keys` where `column` like '$keyword%' LIMIT 0 , 10") or die (mysql_error());

if($result) 
{
   while($row = mysql_fetch_assoc($result)){
   echo '<div id="link" onclick="addText(\''.$row['keyword'].'\')" ">'.$row['keyword'].'</div>';
   }
}
于 2012-10-22T23:03:18.980 に答える