PHP Combat fourth day _php tutorial

Source: Internet
Author: User
Okay, first, look, this is the AJAX message board. There's a waterfall flow, huh?


1. Today I learned the Ajax of jquery, directly on the code


[PHP]/JavaScript Document
$ (document). Ready (function (e) {
Loadhiglight ();//Load Highlight effects


$ ("#submit"). Click (function () {//' Leave Message ' button clicking Event
Get user Name
var strusetname = $ ("#userName"). Val ();
Get input message Content
var strcontent = $ ("#content"). Val ();
Get input Mailbox
var Stremail = $ ("#email"). Val ();

Start sending data
$.ajax ({
URL: ' Index.php?m=index&a=add ',
Type: ' POST ',
DataType: ' JSON ',
Data: {
Username:strusetname,
Content:strcontent,
Email:stremail
},
Success:function (JSON, Textstatus, XHR) {
if (json.state== ' OK ') {
Alert (' Operation tips, message success! ');
alert ();
var data=json.data[0];
var strtag=createtag (data.username,data.content,data.time);

$ (strtag). Prependto (' div #liuyan ');

//$("Hello world!"). Prependto (" P ");
}else{
Alert (' Operation Tip, message failed! \ n Error message: ' +json.error ';
}
}
})
});
Dynamic Loading Message
Loadmore ();
});

Monitoring scroll bar scrolling
$ (window). Scroll (function () {
Load new content when scrolling to the bottom 100 pixels
if ($ (document). Height ()-$ (this). ScrollTop ()-$ (this). Height () < 5) {
Loadmore ();
};
});



FY = 0;
function Loadmore () {
fy++;
Alert (FY);
$.getjson ("index.php?m=index&a=data&page=" + fy + "&rand=" + math.random (), function (JSON) {

for (var i = 0; I <= json.length-1; i++) {
Alert (json[i][' userName ');
Content = '' + json[i][' userName ' + '' + json[i][' content ' + ' + getlocaltime (json[i][' time ') + ';
Content= "
alert (content);
$ ("div #liuyan"). Append (Createtag (json[i][' userName '],json[i][' content '],json[i][' time '));
Loadhiglight ();
};

});
}

function Loadhiglight () {//For Ajax post-reload effects
$user = $ ("div. User");
$text = $ ("div. text");

$ ("div. Content"). each (function (index) {
$ (this). MouseMove (function () {

$user. EQ (index). CSS ("Color", "#0A8CD2");

$user. EQ (index). CSS ("Background", "#FFE6AD");
$text. EQ (index). CSS ("Background", "#FFFDF6");

}). mouseout (function () {

$user. EQ (index). CSS ("Color", "#000");

$user. EQ (index). CSS ("Background", "#E6F0F9");
$text. EQ (index). CSS ("Background", "#F8FBFD");
});
});
}
function Createtag (usetname, content, time) {
var strtag = '' + usetname + '' + content + ' + getlocaltime (time) + ';
return strtag;
}
function Getlocaltime (NS) {
return new Date (parseint (NS) *). toLocaleString (). Replace (/:\d{1,2}$/, ");
}

JavaScript Document
$ (document). Ready (function (e) {
Loadhiglight ();//Load Highlight effects


$ ("#submit"). Click (function () {//' Leave Message ' button clicking Event
Get user Name
var strusetname = $ ("#userName"). Val ();
Get input message Content
var strcontent = $ ("#content"). Val ();
Get input Mailbox
var Stremail = $ ("#email"). Val ();

Start sending data
$.ajax ({
URL: ' Index.php?m=index&a=add ',
Type: ' POST ',
DataType: ' JSON ',
Data: {
Username:strusetname,
Content:strcontent,
Email:stremail
},
Success:function (JSON, Textstatus, XHR) {
if (json.state== ' OK ') {
Alert (' Operation tips, message success! ');
alert ();
var data=json.data[0];
var strtag=createtag (data.username,data.content,data.time);

$ (strtag). Prependto (' div #liuyan ');

$ ("Hello world!"). Prependto ("P");
}else{
Alert (' Operation Tip, message failed! \ n Error message: ' +json.error ';
}
}
})
});
Dynamic Loading Message
Loadmore ();
});

Monitoring scroll bar scrolling
$ (window). Scroll (function () {
Load new content when scrolling to the bottom 100 pixels
if ($ (document). Height ()-$ (this). ScrollTop ()-$ (this). Height () < 5) {
Loadmore ();
};
});

FY = 0;
function Loadmore () {
fy++;
Alert (FY);
$.getjson ("index.php?m=index&a=data&page=" + fy + "&rand=" + math.random (), function (JSON) {

for (var i = 0; I <= json.length-1; i++) {
Alert (json[i][' userName ');
Content = '+ json[i][' userName '+ ' + ' + json[i][' content ' + ' + getlocaltime (json[i][' time ') + ';
Content= "
alert (content);
$ ("div #liuyan"). Append (Createtag (json[i][' userName '],json[i][' content '],json[i][' time '));
Loadhiglight ();
};

});
}

function Loadhiglight () {//For Ajax post-reload effects
$user = $ ("div. User");
$text = $ ("div. text");

$ ("div. Content"). each (function (index) {
$ (this). MouseMove (function () {

$user. EQ (index). CSS ("Color", "#0A8CD2");

$user. EQ (index). CSS ("Background", "#FFE6AD");
$text. EQ (index). CSS ("Background", "#FFFDF6");

}). mouseout (function () {

$user. EQ (index). CSS ("Color", "#000");

$user. EQ (index). CSS ("Background", "#E6F0F9");
$text. EQ (index). CSS ("Background", "#F8FBFD");
});
});
}
function Createtag (usetname, content, time) {
var strtag = '+ usetname + '+ content + ' + getlocaltime (time) + ';
return strtag;
}
function Getlocaltime (NS) {
return new Date (parseint (NS) *). toLocaleString (). Replace (/:\d{1,2}$/, ");
} The requested method is


[PHP] Function data ()
{
Introduction of Paging Class
Include "page.class.php";
Get the number of data tables
$rows = $this->db->count (' SELECT * from data ');
Create a Paging object
$page = new Page ($rows, 5, "");
$list = $this->db
->order (' ID DESC ')
->table (' data ')
->limit ($page->getlimit ())
->select ();
/*
echo "

";
Var_dump ($list);
echo "
";
*/
echo Json_encode ($list);
Exit ();
}

function data ()
{
Introduction of Paging Class
Include "page.class.php";
Get the number of data tables
$rows = $this->db->count (' SELECT * from data ');
Create a Paging object
$page = new Page ($rows, 5, "");
$list = $this->db
->order (' ID DESC ')
->table (' data ')
->limit ($page->getlimit ())
->select ();
/*
echo "

";
Var_dump ($list);
echo "
";
*/
echo Json_encode ($list);
Exit ();
}
This realizes the waterfall flow effect, a little disadvantage is if loaded into the last but no hint of oh, haha haha,

[PHP] function Add () {
//Adds the number of affected bars after adding, if greater than 0 adds success
$json [' State ']= ' no ';
if (Empty ($_post[' userName ')) {
$json [' Error ']= ' did not enter a user name ';

}elseif (Empty ($_post[' content ')) {
$json [' Error ']= ' did not enter message content ';

}elseif (Empty ($_post[' email ')) {
$json [' Error ']= ' did not enter a mailbox ';

}else{
isset ($_post[' content ')? $_post[' content ']=nl2br ($_post[' content ']): "";
$_post[' time ']=time ();
if ($this->db->data ($_post)->add () >0) {
/*
echo "add success";
//echo "";//Prevent duplicate submissions of refreshed forms
Header ("http/1.1 303 See other");
Header ("Location:"); Turn to the root directory
exit;
/
$json [' state ']= ' OK ';
$json [' Data ']= $this
->db
->table (' data ')
->where (' id= '. $this->db->last_insert_id () )
->select ();
}else {

$json [' Error ']= $this->db->error ();
//die ($this->db->error ());//Add failed output error message
}
}
Echo Json_encode ($json);
//var_dump ($_post);
}

function Add () {
Returns the number of affected bars after addition, if greater than 0 indicates a successful addition
$json [' state ']= ' no ';
if (Empty ($_post[' userName ')) {
$json [' Error ']= ' did not enter a user name ';

}elseif (Empty ($_post[' content ')) {
$json [' Error ']= ' did not enter message content ';

}elseif (Empty ($_post[' email ')) {
$json [' Error ']= ' did not enter the mailbox ';

}else{
Isset ($_post[' content ')? $_post[' content ']=nl2br ($_post[' content ']): "";
$_post[' time ']=time ();
if ($this->db->data ($_post)->add () >0) {
/*
echo "Add success";
echo "";//Prevent duplicate submissions of refreshed forms
Header ("http/1.1 303 See other");
Header ("Location:"); Turn to the root directory
Exit
*/
$json [' state ']= ' OK ';
$json [' Data ']= $this
->db
->table (' data ')
->where (' id= '. $this->db->last_insert_id ())
->select ();
}else {

$json [' Error ']= $this->db->error ();
Die ($this->db->error ());//Add failure output error message
}
}
echo Json_encode ($json);
Var_dump ($_post);
This is the message part of the code, haha, so you can leave a message directly on the page to see the effect, without refreshing the browser children, the effect is more beautiful jquery+ajax is the Ox x.


2. PHP Functions learned today

[PHP] Json_encode ();

Description

string Json_encode( Mixed $value [, int $options = 0 ] )

The value JSON form of the return value

Empty () returns True if the value is empty, returns false with value,

Time () get timestamp

MYSQL_INSERT_ID () returns the ID of the last operation's self-increment field

Json_encode (); Description string Json_encode (mixed $value [, int $options = 0]) returns the JSON form of value values empty () returns True if the value is NULL, returns a false value,
Time () get timestamp
MYSQL_INSERT_ID () returns the ID of the last operation's self-increment field

3. The JavaScript function learned today, which is used to convert timestamps.

[JavaScript] function Getlocaltime (NS) {
return new Date (parseint (NS) *). toLocaleString (). Replace (/:\d{1,2}$/, ");
}
jquery's append () is used to load the HTML in the back of the tag

Prependto () loading HTML code to the front of the label

function Getlocaltime (NS) {
return new Date (parseint (NS) *). toLocaleString (). Replace (/:\d{1,2}$/, ");
}
jquery's append () is used to load the HTML in the back of the tag

Prependto () loading HTML code to the front of the label


4. Get the experience today Ajax loads the page tag and the jquery effect disappears, so after Ajax loads the page tag, you rebind the jquery events and functions. Otherwise the effect will not be.

[JavaScript]





http://www.bkjia.com/PHPjc/477418.html www.bkjia.com true http://www.bkjia.com/PHPjc/477418.html techarticle Okay, let's see, here's the AJAX message board. There is a waterfall flow effect, ha 1. Today we learned about jquery Ajax, directly on the code [PHP]/JavaScript Document $ (document). Ready (Function (E ...

  • Related Article

    Contact Us

    The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

    If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

    A Free Trial That Lets You Build Big!

    Start building with 50+ products and up to 12 months usage for Elastic Compute Service

    • Sales Support

      1 on 1 presale consultation

    • After-Sales Support

      24/7 Technical Support 6 Free Tickets per Quarter Faster Response

    • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.