没注意看代码document.forms[0] 这是文档流中的第1个 form.与此类推把document.forms[0]改成document.getElementById("theForm") 获取id比如： <script> //获取用户输入 var title=document.getElementById("theForm").title.value; var author=document.getElementById("theForm").author.value; var content=document.getElementById("theForm").content.value; </script> <form id='theForm' name="theForm" method="post"> ... </from> 这样加几个form 都可以
根据5楼、7楼的回复很好的解决了问题。6楼： //获取留言列表div容器 var msg=document.getElementById(""); //这里出错原句是： var msg=document.getElementById("msgList"); 为了需要改成了： var msg=document.getElementById("");但是可以正常运行。谢谢各位。
alert('添加成功,正在审核中...');history.go(-1); 这一句就返回了
那有数据写进去
楼上说的没错.<form></form>是前台提交数据到PHP 等于刷新了1次..刷新后数据都被清空了
但是红色代码在，把alert('添加成功,正在审核中...');history.go(-1);删除数据仍然不能被提交。2楼：<form></form>是前台提交数据到PHP 等于刷新了1次..刷新后数据都被清空了
可红色代码处的<form></form>，没有任何参数，只是一个空架子，没有提交任何数据。为什么会把下面代码提交的数据清空？<form name="theForm" method="post">
<dl>
<dt>发表您的留言</dt>
<dd>标题：<input type="text" maxlength="150" size="45" name="title"/></dd>
<dd>作者：<input type="text" maxlength="50" size="45" name="author"/></dd>
<dd>内容：<textarea rows="10" cols="45" name="content"></textarea></dd>
<dd class="button">
<input type="button" onClick="ajaxSubmit()" value="提交"/>
<input type="reset" value="重填"/>
你有
//获取用户输入
var title=document.forms[0].title.value;
var author=document.forms[0].author.value;
var content=document.forms[0].content.value;
表示从第一个表单里读取数据在只有 一个表单 <form name="theForm" method="post"> 时，很自然他就是第一个表单
但你在他前面又加了个表单，于是表单 theForm 就变成第二个了。
没有了数据，也就无所谓添加了
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Ajax GuestBook</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"/>
<script type="text/javascript">
<!--
//将用户输入异步提交到服务器
function ajaxSubmit(){
if (theForm.title.value.length<1)
{
alert("请填写标题！");
theForm.title.focus();
return false;
}
if (theForm.title.value.length>21)
{
alert("标题不能大于20个字");
theForm.title.focus();
return false;
}
if (theForm.content.value=="")
{
alert("必须填写内容");
theForm.content.focus();
return false;
}
//alert('添加成功,正在审核中...');history.go(-1); //获取用户输入
var title=document.forms[0].title.value;
var author=document.forms[0].author.value;
var content=document.forms[0].content.value;
//创建XMLHttpRequest对象
var xmlhttp;
try{
xmlhttp=new XMLHttpRequest();
}catch(e){
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
//创建请求结果处理程序
xmlhttp.onreadystatechange=function(){
if (4==xmlhttp.readyState){
if (200==xmlhttp.status){
var date=xmlhttp.responseText;
addToList(date);
}else{
alert("error");
}
}
}
//打开连接，true表示异步提交
xmlhttp.open("post", "ajaxadd.php", true);
//当方法为post时需要如下设置http头
xmlhttp.setRequestHeader('Content-type','application/x-www-form-urlencoded');
//发送数据
xmlhttp.send("title="+escape(title)+"&author="+escape(author)+"&content="+escape(content));}
//将用户输入显示到页面
function addToList(date){
//获取留言列表div容器
var msg=document.getElementById("msgList");
//创建dl标记及其子标记
var dl=document.createElement("dl");
var dt=document.createElement("dt");
var dd=document.createElement("dd");
var dd2=document.createElement("dd"); //将结点插入到相应的位置
msg.insertBefore(dl,msg.firstChild);
dl.appendChild(dt);
dl.appendChild(dd);
dl.appendChild(dd2);
//填充留言内容
dt.innerHTML="标题："+document.forms[0].title.value;
dd.innerHTML="作者："+document.forms[0].author.value+" 日期："+date;
dd2.innerHTML=document.forms[0].content.value;
//清空用户输入框
document.forms[0].title.value="";
document.forms[0].author.value="";
document.forms[0].content.value="";
}
//-->
</script>
</head>
<body> <!-- 加入下面两行代码就失效了，把这两行删除又正常了。若加这两行放在留言板的后面，留言板也能正常添加。
<form>
</form>
--> <div id="postBox">
<form name="theForm" method="post">
<dl>
<dt>发表您的留言</dt>
<dd>标题：<input type="text" maxlength="150" size="45" name="title"/></dd>
<dd>作者：<input type="text" maxlength="50" size="45" name="author"/></dd>
<dd>内容：<textarea rows="10" cols="45" name="content"></textarea></dd>
<dd class="button">
<input type="button" onClick="ajaxSubmit()" value="提交"/>
<input type="reset" value="重填"/>
</dd>
</dl>
</form>
</div>
<div id="msgList">
<?php
error_reporting(0);
$db=mysql_connect('localhost','root','');
$select=mysql_select_db("test");
mysql_query("SET NAMES GBK");
$sql="select title,author,content,date from liuyan order by date desc";
$result=mysql_query($sql);
while($rs=mysql_fetch_array($result))
{
?>
<dl>
<dt>标题：<?php echo $rs['title'].'('.$rs['date'].')';?></dt>
<dd>作者：<?php echo $rs['author'];?> 日期：<?php echo $rs['date'];?></dd>
<dd><?php echo $rs['content'];?></dd>
</dl>
<?php
}
?>
</div>
</body>
</html> 测试通过的代码 //获取留言列表div容器
var msg=document.getElementById(""); //这里出错
没注意看代码document.forms[0] 这是文档流中的第1个 form.与此类推把document.forms[0]改成document.getElementById("theForm") 获取id比如：
<script>
//获取用户输入
var title=document.getElementById("theForm").title.value;
var author=document.getElementById("theForm").author.value;
var content=document.getElementById("theForm").content.value; </script>
<form id='theForm' name="theForm" method="post">
...
</from>
这样加几个form 都可以
//获取留言列表div容器
var msg=document.getElementById(""); //这里出错原句是： var msg=document.getElementById("msgList");
为了需要改成了： var msg=document.getElementById("");但是可以正常运行。谢谢各位。