課程
/前端開發(fā)
/JavaScript
/搜索框制作
神煩。。。
有沒有大神可以解釋一下 ?萬分感謝~
2016-04-28
源自：搜索框制作 2-8
正在回答
原生JS實(shí)現(xiàn)JSONP：
addEvent('search-input-text', 'keyup', function() {
? ? ? ? var searchText = getDOM("search-input-text").value;
? ? ? ? //供jsonp服務(wù)的url地址（不管是什么類型的地址，最終生成的返回值都是一段javascript代碼）
? ? ? ? //其實(shí)參數(shù)都是前端和后臺(tái)程序員規(guī)定的，前端傳過去，后端判斷獲取即可。
? ? ? ? var url = "http://api.bing.com/qsonhs.aspx?type=cb&cb=jsonpcallback&q=" + searchText;
? ? ? ? var script = document.createElement('script');
? ? ? ? script.setAttribute('src', url);
? ? ? ? // 把script標(biāo)簽加入body，此時(shí)調(diào)用開始 ? ? ? ?
? ? ? ? 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://idcbgp.cn/qadetail/75258
這個(gè)回答可以幫你解決
另外，可以學(xué)習(xí)一下慕課網(wǎng)的ajax全接觸這門課程
前輩 ?這個(gè)問題解決了沒有。。
舉報(bào)
本課程從簡(jiǎn)入深講解搜索框的制作，學(xué)習(xí)JQ與JS實(shí)現(xiàn)Ajax技術(shù)的不同點(diǎn)
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號(hào)-11 京公網(wǎng)安備11010802030151號(hào)
購(gòu)課補(bǔ)貼聯(lián)系客服咨詢優(yōu)惠詳情
慕課網(wǎng)APP您的移動(dòng)學(xué)習(xí)伙伴
掃描二維碼關(guān)注慕課網(wǎng)微信公眾號(hào)
2016-11-09
原生JS實(shí)現(xiàn)JSONP：
addEvent('search-input-text', 'keyup', function() {
? ? ? ? var searchText = getDOM("search-input-text").value;
? ? ? ? //供jsonp服務(wù)的url地址（不管是什么類型的地址，最終生成的返回值都是一段javascript代碼）
? ? ? ? //其實(shí)參數(shù)都是前端和后臺(tái)程序員規(guī)定的，前端傳過去，后端判斷獲取即可。
? ? ? ? var url = "http://api.bing.com/qsonhs.aspx?type=cb&cb=jsonpcallback&q=" + searchText;
? ? ? ? var script = document.createElement('script');
? ? ? ? script.setAttribute('src', url);
? ? ? ? // 把script標(biāo)簽加入body，此時(shí)調(diào)用開始 ? ? ? ?
? ? ? ? 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://idcbgp.cn/qadetail/75258
這個(gè)回答可以幫你解決
另外，可以學(xué)習(xí)一下慕課網(wǎng)的ajax全接觸這門課程
2016-05-29
前輩 ?這個(gè)問題解決了沒有。。