我正在做一个 jQuery 移动示例应用程序，在该应用程序中，我根据输入的搜索位置（动态）检索网格中的值。
代码如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<link type="text/css" rel="stylesheet" href="style.css"/>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script src="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.0/jquery.validate.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<link rel="stylesheet" href="http://jqueryui.com/resources/demos/style.css" />
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.css" />
<link type="text/css" rel="stylesheet" href="style.css"/>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
<script>
$(document).ready(function()
{
$('#stoplist').hide();
$('#searchstop').change(function() {
var searchstop=$('#searchstop').val();
$.ajax({
type: "GET",
url: "BilaagValues?searchstop="+searchstop,
success:function (check) {
console.log(check);
var output = JSON.parse(check);
console.log(output);
$("#stoplist").show();
$("#stop1").html(output.stopName);
$("#mailbox1").html(output.mailboxno);
$("#mailboxname").html(output.mailName);
$("#advtbox1").html(output.advtno);
$("#advtboxname").html(output.advtname);
},
success:function (check1) {
console.log(check1);
var output = JSON.parse(check1);
console.log(output);
$("#stoplist1").show();
$("#stop2").append(output.stopName);
$("#mailbox2").append(output.mailboxno);
$("#mailboxname1").append(output.mailName);
$("#advtbox2").append(output.advtno);
$("#advtboxname1").append(output.advtname);
}
});
});
});
</script>
</head>
<body>
<div data-role="header" id="header">
<a href="#" data-role="button" data-icon="bars" data-iconpos="notext" data-theme="c" data-inline="true" id="header"></a>
<h1>Ruteoversikt</h1>
<a href="#" data-role="button" data-theme="b" data-inline="true" id="header">Rediger</a>
</div>
<div>
<input id="searchstop" placeholder = "Stop pa Navvn" /></div>
<hr>
<div id="unitno">221721_0030</div>
<hr>
<br/>
<hr>
<div id="stoplist">
<div class="ui-grid-b" id="address1">
<img id="picture1" src="post1.jpg"/>
<div id="stop1"></div><br>
<div id="mailbox1" style="border-width: 2px; border-style: double; border-color: grey; background-color:green"></div>          <div id="mailboxname"></div>
<div id="advtbox1" style="border-width: 2px; border-style: double; border-color: grey; "></div>               <div id="advtboxname"></div>
</div>
</div>
<div id="stoplist1">
<div class="ui-grid-b" id="address1">
<div id="stop2"></div><br>
<div id="mailbox2" style="border-width: 2px; border-style: double; border-color: grey; background-color:green"></div>         
<div id="mailboxname1"></div>
<div id="advtbox2" style="border-width: 2px; border-style: double; border-color: grey; "></div>               <div id="advtboxname1"></div>
</div>
</div>
<hr>
</body>
</html>
Now here the problem which is arising is that I want the 2nd set of values ie. in div with id "stopList1" to be appended below the first set of values which are there in first grid. In simple terms, The values retrieved for 2nd search should be appended below the first set of values but what is happening in my case is that the next set of values are getting appended above the first set of values,,, in the same grid...!!!!
这个怎么解决？？？？
请帮助您的建议。