入门级有关问题，AJAX如何提交表单FORM
日期：2014-05-16 浏览次数：20677 次
入门级问题，AJAX怎么提交表单FORM？
之前的FORM submit提交,速度比较慢,现在想要用局部刷新,也就是ajax,原来的网页改怎么改呢.查了下资料
submit将跳转整个页面,我只要刷新FORM里面某些数据.我是新手,给个纯ajax的就好了,什么框架真心没精力去琢磨.....谢谢了
<html>
<head><title>TEST
</title>
<style type="text/css">
body {font-size:100%}
input{font-size:105%}
select{font-size:105%}
#log_out
{
position:absolute;
color:black;
font-size:15px;
top:15px;
left:1090px;
}
a{text-decoration:none}
</style>
</head>
<body onLoad="SetFormDefaults()">
<h2 style="text-align:center">TEST</h2>
<script type='text/javascript' language='JavaScript'>
//<!--#Form3-->
</script>
<form method="get" action="iocontrol3.cgi" name="iocontrol3">
<table border="1">
<b><font size="5"> Form3 Control</font>
<tr>
<td>PORT1<br>
<select name="port1" >
<option value="0">OFF
<option value="1">ON
</select>
</td>
<td>PORT2<br>
<select name="port2">
<option value="0">OFF
<option value="1">ON
</select>
</td>
<td>PORT3<br>
<select name="port3">
<option value="0">OFF
<option value="1">ON
</select>
</td>
<td><br>
<input type="submit" name=WM value="submit">
</td>
</tr>
</table>
<br>
</form>
<script type="text/javascript">
function SetFormDefaults()
{
document.iocontrol3.port1.selectedIndex=dport1;
document.iocontrol3.port2.selectedIndex=dport2;
document.iocontrol3.port3.selectedIndex=dport3;
</script>
</html>
------解决方案--------------------
我一般用jquery的ajax方法
表单提交用 data:$("#form1").serialize(), form1为你要提交表单的id
之前的FORM submit提交,速度比较慢,现在想要用局部刷新,也就是ajax,原来的网页改怎么改呢.查了下资料
submit将跳转整个页面,我只要刷新FORM里面某些数据.我是新手,给个纯ajax的就好了,什么框架真心没精力去琢磨.....谢谢了
<html>
<head><title>TEST
</title>
<style type="text/css">
body {font-size:100%}
input{font-size:105%}
select{font-size:105%}
#log_out
{
position:absolute;
color:black;
font-size:15px;
top:15px;
left:1090px;
}
a{text-decoration:none}
</style>
</head>
<body onLoad="SetFormDefaults()">
<h2 style="text-align:center">TEST</h2>
<script type='text/javascript' language='JavaScript'>
//<!--#Form3-->
</script>
<form method="get" action="iocontrol3.cgi" name="iocontrol3">
<table border="1">
<b><font size="5"> Form3 Control</font>
<tr>
<td>PORT1<br>
<select name="port1" >
<option value="0">OFF
<option value="1">ON
</select>
</td>
<td>PORT2<br>
<select name="port2">
<option value="0">OFF
<option value="1">ON
</select>
</td>
<td>PORT3<br>
<select name="port3">
<option value="0">OFF
<option value="1">ON
</select>
</td>
<td><br>
<input type="submit" name=WM value="submit">
</td>
</tr>
</table>
<br>
</form>
<script type="text/javascript">
function SetFormDefaults()
{
document.iocontrol3.port1.selectedIndex=dport1;
document.iocontrol3.port2.selectedIndex=dport2;
document.iocontrol3.port3.selectedIndex=dport3;
</script>
</html>
------解决方案--------------------
我一般用jquery的ajax方法
表单提交用 data:$("#form1").serialize(), form1为你要提交表单的id
$("#subbtn").click(function(){
$.ajax({
type: "post",
url: "consultant_save.action",
data: $("#form1").serialize(),
success: function(data) {
alert("提交成功！");
},
error: function(data) {
alert(data);
}
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
