課程
/前端開發
/JavaScript
/搜索框制作
神煩。。。
有沒有大神可以解釋一下 ?萬分感謝~
2016-04-28
源自：搜索框制作 2-8
正在回答
原生JS實現JSONP：
addEvent('search-input-text', 'keyup', function() {
? ? ? ? var searchText = getDOM("search-input-text").value;
? ? ? ? //供jsonp服務的url地址（不管是什么類型的地址，最終生成的返回值都是一段javascript代碼）
? ? ? ? //其實參數都是前端和后臺程序員規定的，前端傳過去，后端判斷獲取即可。
? ? ? ? var url = "http://api.bing.com/qsonhs.aspx?type=cb&cb=jsonpcallback&q=" + searchText;
? ? ? ? var script = document.createElement('script');
? ? ? ? script.setAttribute('src', url);
? ? ? ? // 把script標簽加入body，此時調用開始 ? ? ? ?
? ? ? ? document.getElementsByTagName('body')[0].appendChild(script);
? ? ? ? getDOM('search-suggest').style.top = getElementTop(getDOM('search-form')) + 38 + 'px';
? ? ? ? getDOM('search-suggest').style.left = getElementLeft(getDOM('search-form')) + 'px';
? ? ? ? getDOM('search-suggest').style.position = 'absolute';
? ? ? ? getDOM('search-suggest').style.display = 'block'; ? ? ? ?
? ? });
? ? function jsonpcallback(data) {
? ? ? ? var data = data.AS.Results[0].Suggests;
? ? ? ? var html = "";
? ? ? ? console.log(data);
? ? ? ? for (var i=0;i<data.length;i++) {
? ? ? ? ? ? html += "<li>" + data[i].Txt + "</li>"
? ? ? ? }
? ? ? ? getDOM('search-result').innerHTML = html;
? ? };
http://www.xianlaiwan.cn/qadetail/75258
這個回答可以幫你解決
另外，可以學習一下慕課網的ajax全接觸這門課程
前輩 ?這個問題解決了沒有。。
舉報
本課程從簡入深講解搜索框的制作，學習JQ與JS實現Ajax技術的不同點
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號-11 京公網安備11010802030151號
購課補貼聯系客服咨詢優惠詳情
慕課網APP您的移動學習伙伴
掃描二維碼關注慕課網微信公眾號
2016-11-09
原生JS實現JSONP：
addEvent('search-input-text', 'keyup', function() {
? ? ? ? var searchText = getDOM("search-input-text").value;
? ? ? ? //供jsonp服務的url地址（不管是什么類型的地址，最終生成的返回值都是一段javascript代碼）
? ? ? ? //其實參數都是前端和后臺程序員規定的，前端傳過去，后端判斷獲取即可。
? ? ? ? var url = "http://api.bing.com/qsonhs.aspx?type=cb&cb=jsonpcallback&q=" + searchText;
? ? ? ? var script = document.createElement('script');
? ? ? ? script.setAttribute('src', url);
? ? ? ? // 把script標簽加入body，此時調用開始 ? ? ? ?
? ? ? ? document.getElementsByTagName('body')[0].appendChild(script);
? ? ? ? getDOM('search-suggest').style.top = getElementTop(getDOM('search-form')) + 38 + 'px';
? ? ? ? getDOM('search-suggest').style.left = getElementLeft(getDOM('search-form')) + 'px';
? ? ? ? getDOM('search-suggest').style.position = 'absolute';
? ? ? ? getDOM('search-suggest').style.display = 'block'; ? ? ? ?
? ? });
? ? function jsonpcallback(data) {
? ? ? ? var data = data.AS.Results[0].Suggests;
? ? ? ? var html = "";
? ? ? ? console.log(data);
? ? ? ? var html = "";
? ? ? ? for (var i=0;i<data.length;i++) {
? ? ? ? ? ? html += "<li>" + data[i].Txt + "</li>"
? ? ? ? }
? ? ? ? getDOM('search-result').innerHTML = html;
? ? };
2016-06-25
http://www.xianlaiwan.cn/qadetail/75258
這個回答可以幫你解決
另外，可以學習一下慕課網的ajax全接觸這門課程
2016-05-29
前輩 ?這個問題解決了沒有。。