相关推荐:JSON表单提交(ajax异步刷新)

JSON简介:JSON: JavaScript Object Notation(JavaScript 对象表示法)JSON 是存储和交换文本信息的语法。类似 XML。JSON 比 XML 更小、更快,更易解析。JSON 文本格式在语法上与创建 JavaScript 对象的代码相同。由于这种相似性,无需解析器,Jav

通常对于无刷新提交表单,我们都是运用ajax实现的。前段时间跟着老大了解到另一种无刷新提交表单的方法,是利用iframe框架实现的。现在整理出来分享给大家。第一种:(html页面)<!DOCTYPE HTML><html lang="en-US"><head>

<meta charset="utf-8">

<title>无刷新提交表单</title>

<style type="text/css">

ul{ list-style-type:none;}

</style></head><body>

<iframe name="formsubmit" style="display:none;">

</iframe>

<!-- 将form表单提交的窗口指向隐藏的ifrmae,并通过ifrmae提交数据。 -->

<form action="form.php" method="POST" name="formphp" target="formsubmit">

<ul>

<li>

<label for="uname">用户名:</label>

<input type="text" name="uname" id="uname" />

</li>

<li>

<label for="pwd">密

码:</label>

<input type="password" name="pwd" id="pwd" />

</li>

<li>

<input type="submit" value="登录" />

</li>

</ul>

</form></body></html>(PHP页面:form.php)<?php

//非空验证

if(empty($_POST['uname']) || empty($_POST['pwd']))

{

echo '<script type="text/javascript">alert("用户名或密码为空!");</script>';

exit;

}

//验证密码

if($_POST['uname'] != 'jack' || $_POST['pwd'] != '123456')

{

echo '<script type="text/javascript">alert("用户名或密码不正确!");</script>';

exit;

} else {

echo '<script type="text/javascript">alert("登录成功!");</script>';

exit;

}

 第二种:(html页面)<!DOCTYPE HTML><html lang="en-US"><head>

<meta charset="utf-8">

<title>iframe提交表单</title></head><body>

<iframe name="myiframe" style="display:none;" onload="iframeLoad(this);"></iframe>

<form action="form.php" target="myiframe" method="POST">

用户名:<input type="text" name="username" /><br/>

密 码:<input type="password" name="userpwd" /><br/>

<input type="submit" value="登录" />

</form>

<script type="text/javascript">

function iframeLoad(iframe){

var doc = iframe.contentWindow.document;

var html = doc.body.innerHTML;

if(html != ''){

//将获取到的json数据转为json对象

var obj = eval("("+html+")");

//判断返回的状态

if(obj.status < 1){

alert(obj.msg);

}else{

alert(obj.msg);

window.location.href="http://www.baidu.com";

}

}

}

</script></body></html>(PHP页面:form.php)<?php

//设置时区

date_default_timezone_set('PRC');

/*

返回的提交消息

status:状态

msg:提示信息

*/

$msg = array('status'=>0,'msg'=>'');

//获取提交过来的数据

$name = $_POST['username'];

$pwd = $_POST['userpwd'];

//模拟登录验证

$user = array();

$user['name'] = 'jack';

$user['pwd'] = 'jack2014';

if($name != $user['name']){

$msg['msg'] = '该用户未注册!';

$str = json_encode($msg);

echo $str;

exit;

}else if($pwd != $user['pwd']){

$msg['msg'] = '输入的密码错误!';

$str = json_encode($msg);

echo $str;

exit;

}

$msg['msg'] = '登录成功!';

$msg['status'] = 1;

$str = json_encode($msg);

echo $str; 

相关推荐:【转】表单提交及关闭当前页面并刷新数据

在DWZ文档中,对于DWZ框架Ajax无刷新表单提交处理流程描述如下:1. ajax表单提交给服务器2. 服务器返回一个固定格式json结构3. js会调函数根据这个json数据做相应的处理注意:DWZ框架默认的ajax表单提交都是返回json数据,告诉客户端

快照源:http://www.cnblogs.com/shouce/archive/2016/04/05/5353694.html