直播系統搭建，可自動模糊匹配的搜尋下拉框

zhibo系統開發發表於2023-04-14

直播系統搭建，可自動模糊匹配的搜尋下拉框

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=
    , initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    搜尋：<input type="text"><br>
    <ul>
    </ul>
</body>
</html>
<script>
    let oInput=document.querySelector('input');
    let oUl=document.querySelector('ul');
    oInput.oninput=function (){
        if(this.value != ""){
            let xhr=new XMLHttpRequest();
        xhr.open('GET','sousuo.php?wd='+this.value,true);
        xhr.send();
        xhr.onreadystatechange=function (){
            if(xhr.readyState==4 && xhr.status==200){
                fun(xhr.responseText);
                console.log(xhr.responseText);
            }
        }
        }else{
oUl.innerHTML = "";
}
        
    }
    function fun(resText){
        //拼接
        let strHtml='';
        //將JSON形式的字串轉為陣列
        let obj=JSON.parse(resText);
        for(let index in obj){
strHtml += `<li>${obj[index]}</li>`;
}
oUl.innerHTML = strHtml;
}
</script>


以上就是直播系統搭建，可自動模糊匹配的搜尋下拉框， 更多內容歡迎關注之後的文章


來自 “ ITPUB部落格 ” ，連結：http://blog.itpub.net/69978258/viewspace-2945780/，如需轉載，請註明出處，否則將追究法律責任。

相關文章