タイトルは少しばかりですが、私の問題は以下で説明します。私は現在、ライブ検索を持っている瞬間最初の単語の後のすべてを削除するJS
:
これは、私はそれが何をしたいのかないが、もちろん、それは、JSの少しでのみ可能です。
あなたが検索から得たオプションの1つをクリックすると、通常はリンクが表示されますが、下のJSを追加して、そこからすべてのHTMLコードを削除し、テキストボックスにドロップダウンします。
<script type="text/javascript">
$(document).ready(function(){
$("#livesearch").click(function(){
var value = $(this).html();
var input = $('#append_value');
var content = value;
var text = $(content).text(); //removes all HTML
input.val(text);
});
});
</script>
これはすべて完璧なことですが、問題はあります。それは、テキストボックスに両方のオプションを追加ダウンドロップからのオプションを選択すると:今
、これは上記のコードとは何かを持っているかもしれないが、私はちょうど、ユーザーが選択したいずれかのオプションたいですテキストボックスに追加します。
たとえば、私は戦場を探して、battlefield1
とbattlefield2
という結果を得ます。ユーザーがbattlefield2
を選択した場合は、battlefield2
をテキストボックスに挿入したいと思います。
私は午後1時以来これをやろうとしていました。私は、私が解決策を探すのに多くの時間を要したと言います。
ご協力いただきありがとうございます。 :)
編集:
私は(はい、私はSQLが廃止されて実現)で検索をやっている:
index.htmlを
<script type="text/javascript">
function lightbg_clr() {
$('#qu').val("");
$('#textbox-clr').text("");
$('#search-layer').css({"width":"auto","height":"auto"});
$('#livesearch').css({"display":"none"});
$("#qu").focus();
};
function fx(str) {
var s1=document.getElementById("qu").value;
var xmlhttps;
if (str.length==0) {
document.getElementById("livesearch").innerHTML="";
document.getElementById("livesearch").style.border="0px";
document.getElementById("livesearch").style.display="block";
$('#textbox-clr').text("");
return;
}
if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttps=new XMLHttpRequest();
} else {// code for IE6, IE5
xmlhttps=new ActiveXObject("Microsoft.XMLHTTPS");
}
xmlhttps.onreadystatechange=function() {
if (xmlhttps.readyState==4 && xmlhttps.status==200) {
document.getElementById("livesearch").innerHTML=xmlhttps.responseText;
document.getElementById("livesearch").style.display="block";
$('#textbox-clr').text("X");
}
}
xmlhttps.open("GET","scripts/search_friends.php?n="+s1,true);
xmlhttps.send();
}
</script>
<input type="text" onKeyUp="fx(this.value)" autocomplete="off" name="qu" id="qu" class="form-control" placeholder="Name of the person or group">
<div class="list-group" id="livesearch"></div>
<input type="text" id="append_valueq">
<script type="text/javascript">
$(document).ready(function(){
$("#livesearch").click(function(){
var value = $(this).val();
var input = $('#append_valueq');
var content = value;
var text = $(content).text();
input.val(text);
});
});
</script>
search_friends。 PHP
<?php
include('../Connections/ls.php'); //script to connect to DB
$s1=$_REQUEST["n"];
$select_query="SELECT * FROM users WHERE Username LIKE '%".$s1."%'";
$sql=mysql_query($select_query) or die (mysql_error());
$s="";
while($row=mysql_fetch_array($sql))
{
$s=$s."
<a href='javascript:void(0)'>".$row['Username']."</a>
" ;
}
echo $s;
?>
これは最終的に私にあなたが最初のイメージで見る結果を与えます。
...私は今、私がいる問題は、div要素がライブサーチ(<div class="list-group" id="livesearch"></div>
)のIDを持っているという事実があることを認識していますので、代わりにドロップダウンの実際のオプションの全体のdivを選択します
質問を編集して関連するHTMLを表示してください。 'value'変数の値は何ですか? (別として、 'var content = value;'は無意味ですが、同じ値を持つ2つの変数になります) – nnnnnn
@nnnnnnこのコメントのために、私が追加しようとしている方法に何か間違っていることを認識しましたテキストボックスに入力します。 – JeanPaul98