ajax无刷新提交表,Ajax无刷新提交表单和显示

Ajax留言本

*{padding:0;margin:0; }li{list-style:none; }body{background:#f9f9f9;font-size:14px; }#box{width:450px;padding:10px;border:1px solid #ccc;background:#f4f4f4;margin:10px auto; }#fill_in{margin-bottom:10px; }#fill_in li{padding:5px 0; }#fill_in .text{width:380px;height:30px;padding:0 10px;border:1px solid #ccc;line-height:30px;font-size:14px;font-family:arial; }#fill_in textarea{width:380px;height:100px;line-height:20px;padding:5px 10px;border:1px solid #ccc;font-size:14px;font-family:arial;overflow:auto;vertical-align:top; }#fill_in .btn{border:none;width:120px;height:30px;border:1px solid #ccc;background:#fff;color:#666;font-size:14px;position:relative;left:42px; }#fill_in .ret{border:none;width:120px;height:30px;border:1px solid #ccc;background:#fff;color:#666;font-size:14px;position:relative;left:42px;margin-left:50px; }#message_text{display:none; }#message_text h2{font-size:14px;padding:6px 0 4px 10px;background:#ddd;border-bottom:1px solid #ccc; }#message_text li{background:#f9f9f9;border-bottom:1px solid #ccc;color:#666;overflow:hidden; }#message_text h3{padding:10px;font-size:14px;line-height:24px; }#message_text p{padding:0 10px 10px;text-indent:28px;line-height:20px; }

varoBtn= null;varoForm= null;varoText= null;varoTextarea= null;vartimer= null;varspeed= 0;varoLi= null

varoH3= null;varoP= null;

window.οnlοad= function()

{

oBtn=document.getElementById("btn");

oBtn.οnclick=getValue;

};functiongetValue()

{

document.getElementById("message_text").style.display= "block";

oForm=document.getElementsByTagName("form")[0];

oText=document.getElementById("text");

oTextarea=document.getElementsByTagName("textarea")[0];

oUl=document.getElementById("message_text").getElementsByTagName("ul")[0];

oForm.οnsubmit= function(){return false; };if( oText.value== "" ||oTextarea.value== "")

{

alert("就二个框，你还不写全了啊？");return;

}

oLi=document.createElement("li");

oH3=document.createElement("h3");

oP=document.createElement("p");

oH3.innerHTML=oText.value;

oP.innerHTML=oTextarea.value;if(oUl.childNodes[0])

{

oUl.insertBefore(oLi,oUl.childNodes[0]);

}else{

oUl.appendChild(oLi);

}

oLi.appendChild(oH3);

oLi.appendChild(oP);

oText.value= "";

oTextarea.value= "";varh=oLi.offsetHeight;

oLi.style.height= ‘0px‘;if(timer)

{

clearInterval(timer);

}

timer=setInterval("goTime("+h+")",35);

goTime(h);

}functiongoTime(target)

{vartop=oLi.offsetHeight;

speed+= 3;

top+=speed;if(top>target)

{

top=target;

speed*= -0.7;

}if(top===target&&Math.abs(speed)< 3)

{

clearInterval(timer);

timer= null;

oLi.style.height=target+ "px";

}

oLi.style.height=top+ "px";

}

请留下您的足迹:

显示留言: