JS調用后臺數據查詢，讓查詢到的數據在下拉列表里顯示
3 回答
紅顏莎娜
TA貢獻1842條經驗 獲得超13個贊
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 | /** * @author zhou2003737 * @date 2014/09/25 16:39 */ <html doctype="html"> <head> <title></title> <script type="text/javascript"> window.onload = function(){ //獲取文本框對象 var searchText = document.getElementById("searchText"); //獲取提交button對象 var action = document.getElementById("action"); //獲取要增加到的下拉列表對象 var selections = document.getElementById("selections"); //點擊提交的時候執行的方法 action.onclick = function(){ //如果文本框對象中值不為空 if(searchText.value ){ //根據文本框中的值循環5次 for(var i =5;i>0;i--){ //設置下拉列表中的值的屬性 var option = document.createElement("option"); option.value = searchText.value + i; option.text= searchText.value+i; //將option增加到下拉列表中。 selections.options.add(option); } } } } //思路如上。你可以將點擊時將文本框中值傳到后臺，后臺返回數據后，在將數據存入下拉列表對象中。 </script> </head> <body> <p><input type="text" placeholder="請輸入查詢對象" autofocus id="searchText"/></p> <p><input type="button" id="action" value="提交"/></p> <p><select id="selections">
</select></p> </body> </html> |
一只斗牛犬
TA貢獻1784條經驗 獲得超2個贊
首先自定義一個ajax獲取要顯示在html頁面上的數據的方法，例如方法getdata,這個方法把獲取的返回值，通過js動態的顯示到html頁面要顯示的區域，然后再寫一個js定時器來實現實時調用數據，
示例：
<script>
//定時器 異步運行
function hello(){
alert("hello");
}
var t2 = window.setTimeout("hello()",3000); //定時器
//window.clearTimeout(t2);//去掉定時器
</script>
把里面的hello方法換成你ajax獲取數據的方法名，然后改下定時器里面的方法名和時間，這里設置的是3秒鐘執行一次可以設置成你自己要的數據，就實現了你要的頁面實時調用數據了。
函數式編程
TA貢獻1807條經驗 獲得超9個贊
1、用戶界面能做的最基礎的事情就是呈現一些數據，React讓顯示數據變得簡單，當數據變化時，用戶界面會自動同步更新。
2、通過例子進行了解：
<!DOCTYPE html>
<html>
<head>
<script src="build/react.js"></script>
<script src="build/JSXTransformer.js"></script>
</head>
<body>
<divid="example"></div>
<script type="text/jsx">
var HelloWorld = React.createClass({
render: function() {
return (
<p>
Hello, <input type="text"placeholder="Your name here" />!
It is {this.props.date.toTimeString()}
</p>
);
}
});
setInterval(function() {
React.render(
<HelloWorld date={new Date()} />,
document.getElementById('example')
);
},500);
</script>
</body>
</html>
添加回答
舉報
0/150
提交
取消