index.html模板文件大内容:

 <html>
<head>
<title>jQuery Ajax 实例演示</title>
</head>
<script src="./js/jquery.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){//这个就是jQueryready ,它就像C语言的main 所有操作包含在它里面
$("#button_login").mousedown(function(){
login(); //点击ID为"button_login"的按钮后触发函数 login();
}); function login(){ //函数 login();
var username = $("#username").val();//取框中的用户名
var password = $("#password").val();//取框中的密码
$.ajax({ //一个Ajax过程
type: "post", //以post方式与后台沟通
url : "login.php", //与此php页面沟通
dataType:'json',//从php返回的值以 JSON方式 解释
data: 'username='+username+'&password='+password, //发给php的数据有两项,分别是上面传来的u和p
success: function(json){//如果调用php成功
//alert(json.username+'n'+json.password); //把php中的返回值(json.username)给 alert出来
$('#result').html("姓名:" + json.username + "<br/>密码:" + json.password); //把php中的返回值显示在预定义的result定位符位置
}
});
}
//$.post()方式:
$('#test_post').mousedown(function (){
$.post(
'login.php',
{
username:$('#username').val(),
password:$('#password').val()
},
function (data) //回传函数
{
var myjson='';
eval_r('myjson=' + data + ';');
$('#result').html("姓名1:" + myjson.username + "<br/>密码1:" + myjson.password);
}
);
});
//$.get()方式:
$('#test_get').mousedown(function (){
$.get(
'login.php',
{
username:$('#username').val(),
password:$('#password').val()
},
function(data) //回传函数
{
var myjson='';
eval_r("myjson=" + data + ";");
$('#result').html("姓名2:" + myjson.username + "<br/>密码2:" + myjson.password);
}
);
});
});
</script>
<body>
<div id="result" style="background:orange;border:1px solid red;width:300px;height:200px;"></div>
<form id="formtest" action="" method="post">
<p><span>输入姓名:</span><input type="text" name="username" id="username" /></p>
<p><span>输入密码:</span><input type="text" name="password" id="password" /></p>
</form>
<button id="button_login">ajax提交</button>
<button id="test_post">post提交</button>
<button id="test_get">get提交</button>
</body>
</html>

login.php文件的内容:

 <?php
echo json_encode(array ('username'=>$_REQUEST['username'],'password'=>$_REQUEST['password']));
?>

PHP提交表单失败后如何保留填写的信息的更多相关文章

  1. (转载)PHP 下 CURL 通过 POST 提交表单失败的原因之一与解决办法

    (转载)http://blog.renren.com/share/246611432/7511385884 前几天在学习使用 CURL 时遇到一个问题:在 a.php 中以 POST 方式向 b.ph ...

  2. Extjs 表单验证后,几种错误信息展示方式

    今天要求对form表单验证,进行系统学习一下,故做了几个示例: Ext.onReady(function(){        var panel=Ext.create('Ext.form.Panel' ...

  3. 用js怎么控制submit提交表单

    需求: 1. 要在点击submit按钮的时候,弹出一个询问框,"你确定要修改?".如果按了"确定"那么就提交表单,否则就保留在原页面,既不提交不跳转. 2. 要 ...

  4. Laravel用post提交表单常见的两个错误

    最近在自学Laravel,测试用post方法提交表单时碰到两个错误: 1.获取传入的值时,报错如下图所示: 在stackFlow找答案时各种解释都有,但认真读一下报错信息,意思大概是:获取Http传入 ...

  5. 使用JS对form的内容验证失败后阻止提交 &&js校验表单后提交表单的三种方法总结

    1.form的两个事件 submit,提交表单,如果直接调用该函数,则直接提交表单 onSubmit,提交按钮点击时先触发,然后触发submit事件.如果不加控制的话,默认返回true,因此表单总能提 ...

  6. A、B同时打开一个页面进行同一条数据库记录进行修改,A修改完成后提交表单,A修改的数据保存完成后;当B也修改完成后,提交数据进行数据修改。此时B修改的内容会覆盖A修改的内容,请问如何避免?

    A.B同时打开一个页面进行数据中的一条数据进行修改,A修改完成后提交表单,数据修改保存完成后B开始页面也修改完成,开始提交进行修改.此时B修改的内容会覆盖A的内容,请问如何避免? 通过搜索和我个人总结 ...

  7. 利用ajaxSubmit()方法实现Form提交表单后回调

    1.      背景 最近在工作中,需要实现网页端图片上传到FTP服务器的功能.上传文件是用Form表单提交数据的方法向后台传输文件流,在此遇到了一个问题:后台在处理完图片上传功能后,需要向前台回传是 ...

  8. 用HTTP状态码实现提交表单后刷新页面不重复提交

    正常情况下,表单提交后如果用户刷新页面会重复提交表单,有些情况下我们不希望表单重复提交,利用HTTP协议中的307状态码重定向页面可以实现这个目的.实例如下: 表单页面代码: <form act ...

  9. iframe中使用模态框提交表单后,iframe加载父页面的解决方法

    在iframe中使用模态框提交表单后,会出现iframe加载整个父页面的问题,如下图: 解决方法: 在form表单中添加target属性 _parent 这个属性会使目标文档载入父窗口或者包含来超链接 ...

随机推荐

  1. 【转】IT大牛博客

    原文:http://blog.csdn.net/qq1175421841/article/details/49384841 首届中国最受欢迎50大技术博客获奖名单如下: 第一名:李会军  http:/ ...

  2. socket.timeout: The read operation timed out 更改pip源至国内镜像,显著提升下载速度

    出现socket.timeout: The read operation timed out  错误的时候,可能是pip源不稳定,改改试试看!  经常在使用Python的时候需要安装各种模块,而pip ...

  3. ubuntu安装thrift

    ubuntu环境下安装thrift-0.10.0 1.解压 2.编译安装 ./configure -with-cpp -with-boost -without-python -without-csha ...

  4. MyEclipse 修改项目部署路径

    就Tomcat来说,MyEclipse默认是使用安装目录下的webapps目录作为部署路径,比如你在设置中为Tomcat选择的根目录是D:\wwwroot,如图所示: 那么在选择Tomcat作为服务器 ...

  5. 编译器处理警告、错误 #pragma GCC diagnostic ignored "-Wunused"

    各个层次的gcc警告从上到下覆盖 变量(代码)级:指定某个变量警告 int a __attribute__ ((unused));指定该变量为"未使用的".即使这个变量没有被使用, ...

  6. springboot源码解读01

    package org.springframework.web; @javax.servlet.annotation.HandlesTypes({org.springframework.web.Web ...

  7. FZU 2150 fire game (bfs)

    Problem 2150 Fire Game Accept: 2133    Submit: 7494Time Limit: 1000 mSec    Memory Limit : 32768 KB ...

  8. unicode 与 utf-8 编码概念及区别

    unicode 是国际组织制定的可以容纳世界上所有文字和符号的字符编码方案.每个字符都对应一个编号,编号的范围是0-0x10FFFF来.Unicode 是为了解决传统的字符编码方案的局限而产生的,它为 ...

  9. 27.用webpack自搭react和vue框架

    自己搭建react-app vue-cli 前置条件 cnpm i -D webpack webpack-cli webpack-dev-server cnpm i -D css-loader sty ...

  10. Mysql 索引迁移策略

    Mysql 索引迁移策略 近日在核查项目中的一些慢sql时发现一个很鸡仔儿的问题,本地开发库表中索引跟生产上差距很大,又因为生产库登录各种麻烦,需要各种验证码,那么多的慢sql分给好些个人,不可能让大 ...