將所選元素從ajax實時搜索複製到文本框

我想複製所選的實時搜索並通過ajax填充文本框名稱「oki」。就像谷歌生活搜索。將所選元素從ajax實時搜索複製到文本框

我正在將數據從xml文件中檢索到ajax實時搜索。

這裏是我的search.html：

<html> 
<head> 
<script> 
function showResult(str) { 
    if (str.length==0) { 
    document.getElementById("livesearch").innerHTML=""; 
    document.getElementById("livesearch").style.border="0px"; 
    return; 
    } 
    if (window.XMLHttpRequest) { 
    // code for IE7+, Firefox, Chrome, Opera, Safari 
    xmlhttp=new XMLHttpRequest(); 
    } else { // code for IE6, IE5 
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
    xmlhttp.onreadystatechange=function() { 
    if (xmlhttp.readyState==4 && xmlhttp.status==200) { 
     document.getElementById("livesearch").innerHTML=xmlhttp.responseText; 

     document.getElementById("livesearch").style.border="1px solid #A5ACB2"; 
    } 
    } 
    xmlhttp.open("GET","livesearch.php?q="+str,true); 
    xmlhttp.send(); 
} 

</script> 

</head> 
<body> 

<form> 
<p id="demo"></p> 
<input name="oki" type="text" size="30" onkeyup="showResult(this.value)"> 
<div id="livesearch"></div> 
</form> 

</body> 
</html>

我livesearch.php：

<?php 

$xmlDoc=new DOMDocument(); 
$xmlDoc->load("links.xml"); 

$y=$xmlDoc->getElementsByTagName('country'); 

//get the q parameter from URL 
$q=$_GET["q"]; 

//lookup all links from the xml file if length of q>0 
if (strlen($q)>0) { 
    $hint=""; 
    for($i=0; $i<($y->length); $i++) { 


    if ($y->item($i)->nodeType==1) { 
     //find a link matching the search text 
if (strpos(strtolower($y->item($i)->nodeValue), strtolower($q)) === 0) { 

if ($hint=="") {$hint="<a onclick='alert()'>" . $y->item($i)->nodeValue . "</a>"; 
     } else { 
      $hint=$hint . "<br />". 
      $y->item($i)->nodeValue; 
     } 
     } 
    } 
    } 
} 





// Set output to "no suggestion" if no hint was found 
// or to the correct values 
if ($hint=="") { 
    $response="no suggestion"; 
} else { 
    $response=$hint; 
} 

//output the response 
echo $response; 
?>

我的XML文件：

<?xml version="1.0" encoding="utf-8"?> 
<link> 
<countries> 
    <country code="AF" iso="4">Afghanistan</country> 
    <country code="AL" iso="8">Albania</country> 
    <country code="DZ" iso="12">Algeria</country> 
    <country code="AS" iso="16">American Samoa</country> 
    <country code="AD" iso="20">Andorra</country> 
    <country code="AO" iso="24">Angola</country> 
    <country code="AI" iso="660">Anguilla</country> 
    <country code="AQ" iso="10">Antarctica</country> 
    <country code="AG" iso="28">Antigua And Barbuda</country> 
    <country code="AR" iso="32">Argentina</country> 
    <country code="AM" iso="51">Armenia</country> 
    <country code="AW" iso="533">Aruba</country> 
    <country code="AU" iso="36">Australia</country> 
    <country code="AT" iso="40">Austria</country> 
    <country code="AZ" iso="31">Azerbaijan</country> 
    <country code="BS" iso="44">Bahamas</country> 
    <country code="BH" iso="48">Bahrain</country> 
    <country code="BD" iso="50">Bangladesh</country> 
</countries> 

</link>

注意我嘗試使用錨與點擊，但沒有成功

來源

2015-05-01 yashil dgr

更好地遵循本教程看起來像你..... http://www.w3schools.com/php/php_ajax_php.asp – nifCody

@NifrasIsmail花花公子它沒有解釋如何將建議複製文本 –

對不起不得到問題。如果你選擇一個它顯示在文本框中的消息列表，我的undestand裏有一個消息列表，我是對的嗎？ – nifCody

你試過select2嗎？看起來它有你正在尋找的功能。 https://select2.github.io/

來源

2015-10-28 02:59:48

僅限鏈接的答案因爲鏈接將來可能會死亡而受到極大的阻礙。我建議你用引用來源的引文編輯你的答案。 –

將所選元素從ajax實時搜索複製到文本框

回答

相關問題