站内搜索

基于HTML实现表单提交后不刷新页面 _HTML/Xhtml_网页制作

使用ajax实现表单提交无刷新页面在项目中经常会用到。前一段时间跟着师傅学到了另外几种无刷新提交表单的方法,主要是基于iframe框架实现的。现在整理出来分享给大家。
第一种:
(html页面)

HTML Code复制内容到剪贴板
  1. "en-US">
  2. "utf-8">
  3. 无刷新提交表单
  4. "form.php" method="POST" name="formphp" target="formsubmit">
    • "text" name="uname" id="uname" />
    • "password" name="pwd" id="pwd" />
    • "submit" value="登录" />
  5. (PHP页面:form.php)
  6. //非空验证
  7. if(empty($_POST['uname']) || empty($_POST['pwd']))
  8. {
  9. echo '';
  10. exit;
  11. }
  12. //验证密码
  13. if($_POST['uname'] != 'jack' || $_POST['pwd'] != '123456')
  14. {
  15. echo '';
  16. exit;
  17. } else {
  18. echo '';
  19. exit;
  20. }


第二种:
(html页面)

HTML Code复制内容到剪贴板
  1. "en-US">
  2. "utf-8">
  3. iframe提交表单
  4. "form.php" target="myiframe" method="POST">
  5. 用户名:"text" name="username" />
  6. 密 码:"password" name="userpwd" />
  7. "submit" value="登录" />

(PHP页面:form.php)

XML/HTML Code复制内容到剪贴板
  1. php
  2. //设置时区
  3. date_default_timezone_set('PRC');
  4. /*
  5. 返回的提交消息
  6. status:状态
  7. msg:提示信息
  8. */
  9. $msg = array('status'=>0,'msg'=>'');
  10. //获取提交过来的数据
  11. $name = $_POST['username'];
  12. $pwd = $_POST['userpwd'];
  13. //模拟登录验证
  14. $user = array();
  15. $user['name'] = 'jack';
  16. $user['pwd'] = 'jack2014';
  17. if($name != $user['name']){
  18. $msg['msg'] = '该用户未注册!';
  19. $str = json_encode($msg);
  20. echo $str;
  21. exit;
  22. }else if($pwd != $user['pwd']){
  23. $msg['msg'] = '输入的密码错误!';
  24. $str = json_encode($msg);
  25. echo $str;
  26. exit;
  27. }
  28. $msg['msg'] = '登录成功!';
  29. $msg['status'] = 1;
  30. $str = json_encode($msg);
  31. echo $str;

以上内容是小编给大家介绍的基于HTML实现表单提交后无刷新页面的相关内容,希望对大家有所帮助!

  • 上一篇:浅析html input 等值改变添加监听事件_HTML/Xhtml_网页制作
  • 下一篇:前端制作中,IE6还有必要兼容吗?