html5中 FormData api ajax使用的有关问题-php教程-PHP中文网

html5中 FormData api ajax使用的有关问题

php中文网

发布： 2016-06-13 11:57:26

原创

1575人浏览过

html5中 FormData api ajax使用的问题
各位朋友看下面的代码：

<br /><!DOCTYPE html><br /><html lang="zh"><br /><head><br />    <meta charset="utf-8"><br />    <title>html5 ajax测试</title><br /><script type="text/javascript"><br />function _send()<br />{<br />    var fm = document.getElementById('tform');<br />    var fd = new FormData(fm);    //把表单的文档对象给传过去<br />    var xhr = new XMLHttpRequest();<br />    xhr.open('POST', './test_post.php', true);<br />    xhr.onreadystatechange = function ()<br />    {<br />        if (this.readyState == 4)<br />        {<br />            document.getElementById('debug').innerHTML = this.responseText;         <br />        }<br />        //document.getElementById('debug').innerHTML = this.readyState;<br />    }<br />    xhr.send(fd);<br />}<br /></script><br /></head><br /><body><br /><form id="tform"><br /><p>用户名：<input type="text" name="username" /></p><br /><p>年龄：<input type="text" name="age" /></p><br /><p>邮箱：<input type="text" name="email" /></p><br /><p>性别：<input type="text" name="gender" /></p>
                    <div class="aritcle_card">
                        <a class="aritcle_card_img" href="/ai/1365">
                            <img src="https://img.php.cn/upload/ai_manual/000/000/000/175679975740787.png" alt="腾讯云AI代码助手">
                        </a>
                        <div class="aritcle_card_info">
                            <a href="/ai/1365">腾讯云AI代码助手</a>
                            <p>基于混元代码大模型的AI辅助编码工具</p>
                            <div class="">
                                <img src="/static/images/card_xiazai.png" alt="腾讯云AI代码助手">
                                <span>205</span>
                            </div>
                        </div>
                        <a href="/ai/1365" class="aritcle_card_btn">
                            <span>查看详情</span>
                            <img src="/static/images/cardxiayige-3.png" alt="腾讯云AI代码助手">
                        </a>
                    </div>
                <br /><p><input type="submit" value="ajax发送" onclick="_send();"></p><p><span>立即学习</span>“<a href="https://pan.quark.cn/s/cb6835dc7db1" style="text-decoration: underline !important; color: blue; font-weight: bolder;" rel="nofollow" target="_blank">前端免费学习笔记（深入）</a>”；</p><br /></form><br /><div id="debug"><br /></div><br /></body><br /></html><br />

登录后复制

我的test_post.php中的代码是：

<br /><?php<br />print_r($_POST);<br />?><br />

登录后复制

在我的表单中正常输入数据后，点击提交，为什么我的：

中没有显示test_post.php中的数据，求解啊！
------解决方案--------------------
第十行的错了, new的new FormData 是没有参数的,然后利用生成的对象append 数据
------解决方案--------------------

应为
return _send();">
_send 应返回 false
或
button" value="ajax发送" onclick="_send();">