zoukankan      html  css  js  c++  java
  • 百度搜索效果(jsonp法)

    百度搜索效果(jsonp法):

    不需要放在服务器中,本地就可以执行

    <!DOCTYPE html>
    <html>
    	<head>
    		<meta charset="UTF-8">
    		<title>jsonp法</title>
    		<style type="text/css">
    			* {
    				margin: 0;
    				padding: 0;
    				list-style: none;
    			}
    			#box {
    				 500px;
    				margin: 50px auto 0;
    			}
    			#ipt {
    				 480px;
    				height: 30px;
    				padding: 0 8px;
    				line-height: 30px;
    				font-size: 18px;
    			}
    			#list {
    				padding: 0 10px;
    				background: #e3e3e3;
    			}
    			#list li {
    				line-height: 26px;
    				font-size: 16px;
    				color: blue;
    			}
    			#list li:hover {
    				background: #ccc;
    			}
    		</style>
    	</head>
    	<body>
    		<div id="box">
    			<input type="text" name="ipt" id="ipt" value="" />
    			<ul id="list">
    				<!--<li>12306</li>
    				<li>hao123</li>-->
    			</ul>
    		</div>
    		<script src="ajax.js" type="text/javascript" charset="utf-8"></script>
    		<script type="text/javascript">
    			var ipt = document.getElementById('ipt');
    			var list = document.getElementById('list');
    			var Script = null;
    			ipt.onkeyup = function() {
    				if(Script) {//如果存在先移除
    					document.body.removeChild(Script);
    				}
    				Script = document.createElement('script');
    				Script.src = 'http://suggestion.baidu.com/su?wd=' + ipt.value+'&cb=mycallback&_='+new Date().getTime();
    				document.body.appendChild(Script);
    			}
    			function mycallback(json) {
    				list.innerHTML = '';
    				for(var i = 0; i < json.s.length; i ++) {
    					list.innerHTML += '<li>'+json.s[i]+'</li>'
    				}
    			}
    		</script>
    	</body>
    </html>
    

      

  • 相关阅读:
    nsurlSession
    IOS 锁
    常见问题
    xcode编译太慢
    ios之keychain
    iOS多线程系列(四)----GCD之Dispatch Queues
    iOS多线程系列(三)----NSOperationQueue
    iOS多线程系列(二)------NSOperation
    iOS多线程系列(一)------NSThread
    kvm虚拟机最佳实践系列3-kvm克隆和静态迁移
  • 原文地址:https://www.cnblogs.com/handsomehan/p/5868847.html
Copyright © 2011-2022 走看看