基于HTML实现表单提交后不刷新页面

使用ajax实现表单提交无刷新页面在项目中经常会用到。前一段时间跟着师傅学到了另外几种无刷新提交表单的方法,主要是基于iframe框架实现的。现在小编整理特此分享脚本之家平台供大家参考

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

HTML Code复制内容到剪贴板

  1. nbsp;HTML>                <span class="pun">无刷新提交表单</span>     ul{ list-style-type:none;}                         

登录后复制            (PHP页面:form.php)    <?php //非空验证 if(empty($_POST['uname']) || empty($_POST['pwd'])) { echo 'alert(“用户名或密码为空!”);’;    exit;    }    //验证密码 if($_POST[‘uname’] != ‘jack’ || $_POST[‘pwd’] != ‘123456’)    {    echo ‘alert(“用户名或密码不正确!”);’;    exit;    } else {    echo ‘alert(“登录成功!”);’;    exit;    }

第二种: 

(html页面) 

HTML Code复制内容到剪贴板

  1. nbsp;HTML>                <span class="pln">iframe</span><span class="pun">提交表单</span>                

登录后复制     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"; } } }         

(PHP页面:form.php) 

立即学习“前端免费学习笔记(深入)”;

XML/HTML Code复制内容到剪贴板

  1. 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;

登录后复制

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

相关推荐:

多种实例解析HTML表单form的使用方

以上就是基于HTML实现表单提交后不刷新页面的详细内容,更多请关注【创想鸟】其它相关文章!

声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。

点点赞赏,手留余香

给TA打赏
共0人
还没有人赞赏,快来当第一个赞赏的人吧!
    编程技术

    浅谈html转义及防止javascript注入攻击的方法

    2025-4-4 17:28:28

    编程技术

    HTML中表单组件

    2025-4-4 17:29:27

    0 条回复 A文章作者 M管理员
    欢迎您,新朋友,感谢参与互动!
      暂无讨论,说说你的看法吧
    个人中心
    购物车
    优惠劵
    今日签到
    私信列表
    搜索