Question

jsp submit 只处理 不跳转

<form name="form1" id="form1" method="post" action="">
<textarea name="text1" id="text1"></textarea>
<input type="submit" value="submit"/>
</form>
我想把submit后，取得textarea里的内容，交给java处理（如插入数据库等操作）。
但是，我不想让它跳转，因为整个页面比较多的东西，刷新太发指了。这个时候是可以使用iframe，但iframe有iframe的不好。
我知道ajax可以做到这点，怎么做啊？

Answer 1

我给您一个解决方案吧,网上的例子大多可以找到一些用jquery库的$.ajax方法来实现ajax提交,但您所说的,页面会有很多数据,如果使用未封装过的ajax代码会显得很长,在之前的开发中我发现一个jquery插件jquery.form.js,它的主要功能是将表单数据封装,可以用少量代码就能实现整个表单数据ajax提交
正面我们开始吧(当然,如果你有用过jquery这个JS库就很方便了,不懂也不要紧,跟着我做就行)
首先,下载两个js文件,
jquery库文件:https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js
可以直接下载下来或者直接<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>,
jqueryForm: https://raw.github.com/malsup/form/master/jquery.form.js
将这些库都包含到您的页面中,同时加入
<script type="text/javascript">

$(function(){
//接下来的JS代码都将会在这里编写:>
});

</script>

比如现在有一个表单<form id="demo" action="proccess.jsp">
<input type="text" name="username" />
<span id="msg"></span><!--这里显示服务器处理表单提交后结果-->
</from>
开始在上面的JS代码段中写代码
$('#myForm1').ajaxForm({
target:'#msg',//使提交后服务器结果显示容器
success:function(responseText, statusText, xhr, $form){
//这里可以自定服务器返回消息处理,如果在这里处理了,target及msg就不必设置了,看您有没有这方面的需求
}
});//这里调用jquery库方法,返回id为demo的jquery对象(经过jquery封装后的DOM对象),并调用jqueryForm的ajaxForm方法
至此,已经完成了,是不是很简单,你先试下,觉得满意就给个分,第一次来知道回答问题,哈哈
回来的时候发现已经有人比我先提交了,杯具呀..看来不能写得太慢了

追问

谢谢，你和二楼都回答得非常好。弄得我有些为难。
再问一下，由于ajax里的innerHTML，不会把目标页面的javascript包含进来，那就要在首页里把所有javascript文件都包含进来，这样肯定会降低加载首页的速度。
使用ajax必须这么做么？

追答

其实这问题不大的啦,你可以下载压缩版的jquery库和插件,用不了100K的,对于现在的网络来说都不是什么大问题,放心大胆的去用:),
PS:jquery是一个比较强大的JS库,虽然没有EXTJS那样丰富的API,但它可以完成很多我们日常要做但用原始API又比较繁琐的方法,所以值得学习一下,当然我也不太建议你迷恋它,学好JavaScript才是王道,jquery只是一种良好的封装了,二楼说的W3CSchool里的都是原始的API,jquery的实现也是像那样的,有兴趣可以去看看它ajax方法的实现

Answer 2

简单。。。
<form name="form1" id="form1" method="post" action="">
<textarea name="text1" id="text1"></textarea>
<input type="button" value="submit" onclick="doSave()"/>
</form>

<script type="text/javascript">
function doSave(){
var text=$("#text1").val();
if(null != text && "" == text){
$.messager.alert('提示','请输入内容!','error');
return;
}
var options = {
success: callback,
type: 'post',
dataType: 'json',
clearForm: true
};
$('#form1').ajaxSubmit(options);
}
function callback(data){
这里面写你自己的回调函数。。。
}
</script>
我用的是jquery里面的ajax方法。。自己多在网上找找。。对你有很大的提高的

Answer 3

可以写javascript，return false即可，需要传到后台的话要用ajax。

document.getElementByTagName("form").onsubmit = function() {
    // 你的代码
    // 如果要传到后台，需要用ajax
    return false;
}

Answer 4

http://www.w3school.com.cn/ajax/学习一下，你就懂了。

Answer 5

你 代码错了