ajax+php no refresh post and registration verification example_PHP tutorial
WBOY
Release： 2016-07-13 10:48:56
Original
926 people have browsed it
This article will introduce to you an original ajax+php non-refresh post reply and registration verification example. If you are interested in this, feel free to refer to it.
Look at the xin.sql database first, we can directly copy and save it into xxx.sql.
The code is as follows
Copy code
代码如下
复制代码
use xin;
CREATE TABLE bbs_post (
id int(11) NOT NULL auto_increment,
title varchar(255) NOT NULL,
username varchar(255) NOT NULL,
content varchar(255) NOT NULL,
threadid int(11) NOT NULL,
PRIMARY KEY (id)
);
use xin;
CREATE TABLE bbs_post (
id int(11) NOT NULL auto_increment,
title varchar(255) NOT NULL,
username varchar(255) NOT NULL,
content varchar(255) NOT NULL,
threadid int(11) NOT NULL,
PRIMARY KEY (id)
);
INSERT INTO bbs_post VALUES (1,'Do you know about Ajax technology?','ajaxuser','How to learn Ajax technology?',1),(2,'It should be good to learn through examples','tom', 'Look at the basic concepts first, and then learn more from examples. ',1),(3,'Thank you!','max','Thank you very much for your suggestions!',1);
index.php file
The code is as follows
Copy code
代码如下
复制代码
无刷新显示回帖
无刷新显示回帖
$conn = @mysql_connect("localhost","root","123") or die ("MySql连接错误");
mysql_select_db("xin",$conn);
mysql_query("set names 'utf8'");
$sql = "select * from bbs_post where threadid = 1 order by id asc";
$query = mysql_query($sql);
while($row = mysql_fetch_array($query)){
?>
[]
<?=$row[content]?>
}
?>
回帖
姓名：
标题：
内容：
Display replies without refreshing
Display replies without refreshing
$conn = @mysql_connect("localhost","root","123") or die ("MySql connection error");<🎜>
mysql_select_db("xin",$conn);<🎜>
mysql_query("set names 'utf8'");<🎜>
$sql = "select * from bbs_post where threadid = 1 order by id asc";<🎜>
$query = mysql_query($sql);<🎜>
while($row = mysql_fetch_array($query)){<🎜>
?>
bbs.js file, which contains a large number of ajax files
The code is as follows
Copy code
//First create an empty bbs.js file and modify its properties to utf-8 before saving Chinese.
var xmlHttp; //Global variables used to save XMLHttpRequest objects
var username;
var title;
var contents;
var threadid;
//Used to create XMLHttpRequest object
function createXmlHttp() {
//Use different creation methods depending on whether the window.XMLHttpRequest object exists
If (window.XMLHttpRequest) {
xmlHttp = new XMLHttpRequest(); //Creation methods supported by browsers such as FireFox and Opera
} else {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");//Creation methods supported by IE browser
}
}
//Submit reply to server
function submitPost() {
//Get the four parts of information: name, title, content, and topic number in the post
Title = document.getElementById("post_title").value;
Content = document.getElementById("post_content").value;
threadid = document.getElementById("threadid").value;
alert(username+""+title+""+content+""+threadid);
If (checkForm()) {
createXmlHttp(); //Create XMLHttpRequest object
xmlHttp.open("POST", "bbs_post.php", true);
//Set the POST request body type
xmlHttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlHttp.send("username=" + encodeURI(username) +
"&title=" + encodeURI(title) +
"&content=" + encodeURI(content) +
"&threadid=" + threadid); "&threadid=" + threadid); //Send a request body containing four parameters
}
}
//Check whether the form has been filled in
function checkForm() {
If (username == "") {
alert("Please fill in your name");
return false;
} else if (title == "") {
alert("Please fill in the title");
return false;
} else if (content == "") {
alert("Please fill in the content");
return false;
}
Return true;
}
//Get the callback function of query options
function submitPostCallBack() {
If (xmlHttp.readyState == 4) {
alert(xmlHttp.responseText);
createNewPost(xmlHttp.responseText);
}
}
//Create a new reply
function createNewPost(postId) {
//Clear all information in the current form
Document.getElementById("post_title").value = "";
Document.getElementById("post_content").value = "";
Document.getElementById("username").value = "";
var postDiv = createDiv("post", ""); //Create the outer div of the reply
PostDiv.id = "post" + postId; //Assign id value to new div
var postTitleDiv = createDiv("post_title", title + " [" + username + "]"); //Create title div
var postContentDiv = createDiv("post_content", "
" + content + "
"); //Create content div
PostDiv.appendChild(postTitleDiv); //Append the title to the outer div
PostDiv.appendChild(postContentDiv); //Append content to the outer div
document.getElementById("thread").appendChild(postDiv); //Append the outer div to the theme div
}
//Create a new div based on className and text
function createDiv(className, text) {
var newDiv = document.createElement("div");
newDiv.className = className;
newDiv.innerHTML = text;
Return newDiv;
}
/* Style of prompt information div */
#statusDiv {
Border:1px solid #999;
background:#FFFFCC;
Width:100px;
position:absolute;
Top:50%;
left:50%;
Margin:-50px 0 0 -100px;
Width:280px;
}/* Post style */
div.post {
Border-bottom:1px solid black;
padding:5px;
}/* Post title style */
div.post_title {
Border-bottom:1px dotted #0066CC;
font-weight:bold;
}/* Post content style */
div.post_content {
font-size:12px;
Margin:5px;
}/* Basic style of reply form */
table.reply {
Border-collapse:collapse;
Width:300px;
}/* Reply table cell style */
table.reply td {
Border:1px solid black;
padding:3px;
}
/* Reply form header style */
table.reply td.title {
background:#003366;
Color:#FFFFFF;
}
/* Form element styles */
input, textarea {
Border:1px solid black;
}
/* Text area style */
textarea {
Width:200px;
height:50px;
}
/* Predefined format styles */
pre {
Margin:0;
}
http://www.bkjia.com/PHPjc/632762.htmlwww.bkjia.comtruehttp: //www.bkjia.com/PHPjc/632762.htmlTechArticleThis article will introduce to you an original ajax+php no-refresh reply and registration verification example. If you If you are interested in this, please feel free to enter for reference. First look at the xin.sql database, we can directly copy...
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
