|
ajax格式，(key:value,)value值用单引号括起来
$.ajax({
type:,//'post','get'
url:,//action的路径
data:,//传到后台的参数,多个参数的连接符为'&'
success:function(msg){}//对返回的JSP页面或结果进行处理
});
1)jsp：
<tdstyle="width:155px;">
<inputtype="text"name="sn"id="sn"onkeyup="getsn()"value="${sn}"autocomplete="off"/>
</td>
<tdstyle="width:155px;">
<%--<divid="div_sn"style="position:absolute;left:150;top:10;z-index:0;width:155px;"></div>--%>
<divid="div_sn"style="width:155px;"></div>
</td>
2)Javascript:
data的值表示把页面的值传到后台(/GetSN.action)，多个参数的连接符为'&'
执行成功后把结果放到一个JSP页面(ajaxSN.jsp)，通过success:function(msg)，放到ID为'div_sn'
functiongetsn(){
document.getElementById("div_sn").style.display="block";
varsn=$('#sn').val();
varproduct=$('#product').val();
if(sn.length>5){
$.ajax({
type:'post',
/GetSN.action'" rel="nofollow" target="_blank">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>
<metahttp-equiv="Content-Type"content="text/html;charset=UTF-8">
<title>JSPPage</title>
<styletype="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><divclass="DivSelect"><selectclass="SelectList"name="select_sn"id="select_sn"onchange="select_getSN();"><optionvalue="${sn}">${sn}</option><s:iteratorvalue="snList"id='char'status='st'><optionvalue="${char}">${char}</option></s:iterator></select></div></body></html> （编辑：李大同）
【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!
|
