ajax情况下阻止submit提交
背景描述:
有一个表单,里面有姓名,昵称,电话等信息,然后提交的时候要进行一些判断,比如是不是没有填写,电话号码是否符合规则等等,判断不通过的话,则阻止提
交。还有一项需求是判断昵称是否含有系统要过滤的词汇,而这些词汇的列表存放在服务器上,所以需要用到ajax来做。
我的做法是在form里加上onsubmit="return checkForm();",如果checkForm()返回false,将阻止提交,如果返回true,表单就提交了。
问题描述:
前面的那些判断都可以阻止,但是ajax的却不行,因为ajax是异步的,如:
function checkForm(
)
{
if
(
document.
getElementById(
'name'
)
.
value =
=
''
)
{
alert(
'名字不能为空'
)
;
return false;
}
requestAjax(
'test.php'
,
'par=val'
,
'get'
,
callback)
;
}
function callback(
)
{
if
(
ajax.
responseText =
=
'N'
)
{
return false;
}
}
检测结果需要等到服务器返回,但是onsubmit不会等到ajax返回就已经提交了。
解决方案:
后来通过网上搜索,找到一种解决方法。就是不用submit按钮,而是换成button,给予button一个click事件,button的
onclick触发checkForm函数,然后如果ajax返回的时候N,就return
false,如果是Y,就执行document.forms["testf"].submit();代码如下:
function checkForm(
)
{
if
(
document.
getElementById(
'name'
)
.
value =
=
''
)
{
alert(
'名字不能为空'
)
;
return false;
}
requestAjax(
'test.php'
,
'par=val'
,
'get'
,
callback)
;
}
function callback(
相关文档:
为了让各为能够了解什么是AJAX,以下是一个AJAX的手工范例(即不引用任何的Library或AJAX
framework),此范例颇为精要易懂,其作用主要是透过Client 端的Browser来即时监控Web 服务器资源或效能变化,各位只要做过
一遍范例就能够了解AJAX在网页开发上是多么具有威力了。
先来看看效果图:
本范例是一个简单的A ......
Struts2是java在web开发中常用的框架之一,今天小编整理了一下资料,谈谈Struts2的Ajax支持。Struts2的Ajax支持是建立在Dojo和DWR基础之上的,这两个框架都提供了非常成熟的Ajax支持,包括非常优秀的页面控件和简单的DOM操作。其中Dojo提供了丰富的组件库和页面效果,而且提供了大量的函数来简化Ajax过程。DWR(Direct Web R ......
php代码:
<?php
$arr = array(1, '刘天才', 22);\
echo json_encode($arr);die();
?>
js:
<script type="text/javascript">
function returnObj( info )
{
var string = info.responseText;
var array = eval( ......
今天同事告诉我的一个例子,暂时没有时间亲自试验,先记到这里。
jQuery(document).ready(function(){
$.ajax({
......