ajax表单输入

时间:2012-02-23 20:02:15

标签: ajax

我正在尝试构建一个使用AJAX但未能正确执行的表单,这是我第一个文件的代码:

<html>
<head>
<script language="JavaScript" type="text/javascript">
function ajax_post(){

var hr = new XMLHttpRequest();

var url = "my_parse_file.php";
var fn = document.getElementById("first_name").value;


hr.open("POST", url, true);

hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
hr.onreadystatechange = function() {
    if(hr.readyState == 4 && hr.status == 200) {
        var return_data = hr.responseText;
        document.getElementById("status").innerHTML = return_data;
    }
}
hr.send(fn);
document.getElementById("status").innerHTML = "processing...";
}
</script>
</head>
<body>
<h2>Ajax Post to PHP and Get Return Data</h2>
 Todo: <input id="first_name" name="first_name" type="text" /> 
<br /><br />

<input name="myBtn" type="submit" value="Submit Data"     onClick="javascript:ajax_post();">
<br /><br />
<div id="status"></div>
</body>
</html>

并且继承人的第二个:

<?php 
echo  $_POST['firstname'];
 ?>

所有这一切都是显示“处理......”然后它变成空白......任何解决方法?

1 个答案:

答案 0 :(得分:1)

我认为这是因为你没有传递一个键值对。

hr.send('firstname=' + encodeURIComponent(fn));