ajax格式，(key:value,)value值用單引號括起來
$.ajax({
type:, //'post','get'
data:, //傳到後臺的參數,多個參數的連接符爲'&'
success:function(msg){}//對返回的JSP頁面或結果進行處理
});
1)jsp：
<td style="width:155px;">
<input type="text" name="sn" id="sn" onkeyup="getsn()" value ="${sn}" autocomplete="off"/>
</td>
<td style="width:155px;">
<%--<div id="div_sn" style="position:absolute;left :150;top:10;z-index:0;width:155px;"> </div> --%>
<div id="div_sn" style="width:155px;"> </div>
</td>
2)Javascript:
data的值表示把頁面的值傳到後臺(/GetSN.action)，多個參數的連接符爲'&'
執行成功後把結果放到一個JSP頁面(ajaxSN.jsp)，通過 success:function(msg)，放到ID爲'div_sn'
function getsn(){
document.getElementById("div_sn").style.display="block";
var sn = $('#sn').val();
var product=$('#product').val();
if(sn.length>5){
$.ajax({
type:'post',
url:'<%=request.getContextPath()%>/GetSN.action',
timeout:2000,
data:'sn='+$('#sn').val() +'&product='+$('#product').val(),
success:function(msg){
$("#div_sn").html(msg);
}
});
}
}
3)ajaxSN.jsp
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>JSP Page</title>
<style type="text/css">
.DivSelect
{
position: relative;
background-color: transparent;
width: 135px;
overflow: hidden; /*隱藏了小三角，因爲寬度爲110px,而select寬度爲130px*/
border-width:0px;
border-top-style: none;
border-right-style: none;
border-left-style: none;
border-bottom-style: none;
}
/*設置Select樣式*/
.SelectList
{
position: relative;
background-color: transparent;
border-width: 0px;
border-top-style: none;
border-right-style: none;
border-left-style: none;
border-bottom-style: none;
width:155px;
display:block;
overflow:hidden;
}
</style>
</head>
<body>
<div class="DivSelect">
<select class="SelectList" name="select_sn" id="select_sn" onchange="select_getSN();">
<option value="${sn}" >${sn}</option>
<s:iterator value="snList" id='char' status='st'>
<option value="${char}"> ${char}</option>
</s:iterator>
</select>
</div>
</body>
</html>