ajax提交表单

来源:互联网 发布:可以看腐剧的软件 编辑:程序博客网 时间:2024/06/03 15:28

利用表单提交:

<!doctype html><html lang="en"><head><meta charset="UTF-8"><title>表单同步提交</title><script type="text/javascript">window.onload = function(){var str = window.location.search;if(str){var flag = str.split('=');if(flag[1] == 1){document.getElementById('showInfo').innerHTML = '注册成功';}}}</script></head><body><div><div id="showInfo"></div><form action="./01form.php" method="get">用户名:<input type="text" name="username"><br>密码:<input type="password" name="password"><br><input type="submit" value="提交"></form></div></body></html>
01form.php
<?php header("Content-Type:text/html;charset=utf-8");$username = $_GET['username'];$password = $_GET['password'];// $username = $_POST['username'];// $password = $_POST['password'];echo '用户名:'.$username.'密码:'.$password;header("location:./01form.html?flag=1");?>

ajax提交表单:

<!doctype html><html lang="en"><head><meta charset="UTF-8"><title>原生ajax-状态值得含义</title><script type="text/javascript">window.onload = function(){var btn = document.getElementById('btn');btn.onclick = function(){var username = document.getElementById("username").value;var password = document.getElementById('password').value;//第一步:创建xhr对象var xhr = null;if(window.XMLHttpRequest){//标准浏览器xhr = new XMLHttpRequest();}else{//早期的IE浏览器xhr = new ActiveXObject('Microsoft.XMLHTTP');}//第二步:准备发送请求-配置发送请求的一些行为    var url = '05open.php?username='+ encodeURI(username)+'&password='+password;   //var url = '05open.php';xhr.open('get',url);//第三步:执行发送的动作var param = 'username='+username+'&password='+password;xhr.send(null);//第四步:指定一些回调函数xhr.onreadystatechange = function(){if(xhr.readyState == 4){if(xhr.status == 200){var data = xhr.responseText;//jsonconsole.log(data);// var data1 = xhr.responseXML;}}}}}</script></head><body><div><div id="showInfo"></div><form>用户名:<input type="text" name="username" id="username"><br>密码:<input type="password" name="password" id="password"><br><input type="button" value="提交" id="btn"></form></div></body></html>

05open.php

<?php $username = $_GET['username'];$password = $_GET['password'];echo '用户名:'.$username.'密码:'.$password;?>