PHP実践戦闘_PHPチュートリアル 4日目-PHPチュートリアル-php.cn

それでは、まず写真を見てみましょう。これは ajax の掲示板です (笑)。

1. 今日はjqueryのajaxを学び、直接コーディングを始めました

[php] / JavaScript ドキュメント
$(document).ready(function(e) {
LoadHiglight();// ハイライト効果をロードします

$("#submit").click(function() { //「メッセージ」ボタンのクリックイベント
//ユーザー名を取得します
var strUsetName = $("#userName").val(); //入力メッセージの内容を取得します
var strContent = $("#content").val(); //入力メールアドレスを取得します
var strEmail = $("#email").val();
//データ送信開始
$.ajax({
URL: 'index.php?m=index&a=add',
タイプ: 「POST」、
データ型: 'json'、
データ: {
ユーザー名: strUsetName、
コンテンツ: strContent、
メールアドレス: strEmail
}、
成功: function(json, textStatus, xhr) {
If (json.state=='ok') {
alert('操作プロンプト、メッセージは成功しました!'); //alert(); var data=json.data[0]; var strTag=createTag(data.userName,data.content,data.time);
$(strTag).prependTo('div #liuyan');
//$("Hello World!").prependTo("p"); alert('操作プロンプト、メッセージが失敗しました! エラーメッセージ:'+json.error); })
}); //メッセージの動的ロード
もっとロード(); });
//スクロールバーのスクロールを監視します
$(ウィンドウ).scroll(function() {
// 下から 100 ピクセル上にスクロールすると、新しいコンテンツがロードされます
If ($(document).height() - $(this).scrollTop() - $(this).height()
}; });

fy = 0; 関数loadMore() {

//アラート(fy); $.getJSON("index.php?m=index&a=data&page=" + fy + "&rand=" + Math.random(), function(json) {

for (var i = 0; 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() {//为了ajax后重载特效
    $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) * 1000).toLocaleString().replace(/:\d{1,2}$/, ' ');
}

// JavaScript Document
$(document).ready(function(e) {
loadHiglight();//载入高亮特效

$("#submit").click(function() { //“留言”按钮单击事件
  //获取用户名称
  var strUsetName = $("#userName").val();
  //获取输入留言内容
  var strContent = $("#content").val();
  //获取输入邮箱
  var strEmail = $("#email").val();

  //开始发送数据
  $.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('操作提示，留言成功！');
     //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('操作提示，留言失败！\n错误信息:'+json.error);
    }
   }
  })
});
//动态载入留言
loadMore();
});

//监视滚动条滚动
$(window).scroll(function() {
// 当滚动到最底部以上100像素时，加载新内容
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() {//为了ajax后重载特效
$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) + '

';
strTag を返します;
}
関数 getLocalTime(nS) {
return new Date(parseInt(nS) * 1000).toLocaleString().replace(/:d{1,2}$/, ' ');
}リクエストメソッドは

です

[php] 関数 data()
{
//ページングクラスの紹介
「page.class.php」を含めます
//データテーブル内のデータ数を取得します
$rows = $this->db->count('select * from data'); //ページングオブジェクトを作成する
$page = 新しいページ($rows, 5, ""); $list=$this->db
->order('id DESC')
//->table('data')
->limit($page->getLimit())
->select(); /*
echo "

";<br>
var_dump($list);<br>
echo "

";
*/
エコー json_encode($list); 終了(); }

関数data()
{
//ページングクラスを導入します
「page.class.php」をインクルードします;

//データテーブル内のデータ数を取得します

$rows = $this->db->count('select * from data');
//ページングオブジェクトを作成します
$page = 新しいページ($rows, 5, "");
$list=$this->db
->order('id DESC')
//->table('data')
->limit($page->getLimit())
->select();
/*
echo "

";<br>
var_dump($list);<br>
echo "

";
*/
echo json_encode($list);
exit();
}
このようにして、滝の流れの効果が得られます。欠点は、最後までロードするとプロンプトが表示されないことです。ははは、

[php] 関数 add(){
// 追加後に影響を受ける項目の数を返します。0 より大きい場合は、追加が成功したことを意味します
$json['state']='no'; If (empty($_POST['userName'])) {
$json['error']='ユーザー名が入力されていません';
}elseif(empty($_POST['content'])){
$json['error']='メッセージの内容が入力されていません';
}elseif(empty($_POST['email'])){
$json['error']='メールアドレスが入力されていません';
}その他{
isset($_POST['content'])?$_POST['content']=nl2br($_POST['content']):""; $_POST['time']=time(); If($this->db->data($_POST)->add()>0){
/*
echo "正常に追加されました";
// echo "<script>location.reload()</script>";//更新されたフォームを繰り返し送信しないようにします
Header("HTTP/1.1 303 その他を参照");
Header("Location: ") //ルートディレクトリにリダイレクトします
; 終了します;
$json['state']='ok'; $json['data']=$this
->データベース
->テーブル('データ')
->where('id='.$this->db->last_insert_id())
->select(); $json['error']=$this->db->error(); //die($this->db->error());//失敗時の出力エラーメッセージを追加
エコー json_encode($json); //var_dump($_POST); }

関数追加(){
//追加後、影響を受けるアイテムの数を返します。0 より大きい場合、追加は成功したことを意味します
$json['state']='no';

If (empty($_POST['userName'])) {

$json['error']='ユーザー名が入力されていません';

}elseif(empty($_POST['content'])){
$json['error']='メッセージ内容が入力されていません';

}elseif(empty($_POST['email'])){

$json['error']='メールアドレスが入力されていません';

}その他{

isset($_POST['content'])?$_POST['content']=nl2br($_POST['content']):"";
$_POST['時間']=時間();

If($this->db->data($_POST)->add()>0){

/*
echo "正常に追加されました";
//echo "<script>location.reload()</script>";//更新されたフォームを繰り返し送信しないようにします
Header("HTTP/1.1 303 その他を参照");
Header("Location: "); //ルートディレクトリにリダイレクトします
終了します;
*/
$json['state']='ok';
$json['data']=$this
->データベース
->テーブル('データ')
->where('id='.$this->db->last_insert_id())
->select();
}その他{

$json['error']=$this->db->error();
//die($this->db->error());//失敗時の出力エラーメッセージを追加
}
}
echo json_encode($json);
//var_dump($_POST);
これはメッセージ部分のコードです。ブラウザを更新せずに、メッセージを残した後、ページ上で直接効果を確認できます。笑。

2. 今日学んだPHP関数

[php] json_encode();

说明

string json_encode ( mixed $value [, int $options = 0 ] )

戻るvalue JSON 形式の値< ;/ P>

empty() 値が空の場合は True を返します。値がある場合は false を返します

time() タイムスタンプを取得

mysql_insert_id() は最後の操作の増分フィールドを返しますID

json_encode(); 説明 string json_encode (mixed $value [, int $options = 0 ] ) は、JSON 形式の value を返します empty() 値が空の場合は true を返し、値が存在する場合は false を返します。

time() はタイムスタンプを取得します
mysql_insert_id() は、最後の操作でインクリメントされたフィールドの ID を返します

3. 今日学んだJavaScript関数、この関数はタイムスタンプを変換するために使用されます。

[javascript] 関数 getLocalTime(nS) {

新しい Date(parseInt(nS) * 1000).toLocaleString().replace(/:d{1,2}$/, ' '); を返します。 }

jquery の append() は、タグ内の最後の HTML をロードするために使用されます

prependTo() は HTML コードをタグの先頭にロードします

関数 getLocalTime(nS) {
return new Date(parseInt(nS) * 1000).toLocaleString().replace(/:d{1,2}$/, ' ');

}

jqueryのappend()はタグ内の最後のHTMLをロードするために使用されます

prependTo() は HTML コードをタグの先頭に読み込みます

4. 今日得た経験は、ajax が Web ページのタグをロードした後、jquery の特殊効果が消えるということです。したがって、ajax が Web ページのタグをロードした後、jquery のイベントと関数を再バインドする必要があります。そうしないと、特殊効果が失われます。

[javascript]