茄子在线看片免费人成视频,午夜福利精品a在线观看,国产高清自产拍在线观看,久久综合久久狠狠综合

這篇文章主要為大家詳細(xì)介紹了基于jquery實現(xiàn)ajax無刷新評論的相關(guān)資料，具有一定的參考價值，感興趣的小伙伴們可以參考一下

jquery實現(xiàn)ajax無刷新評論需要用的技術(shù)：（本次試驗用的是“jquery-1.4.2.js”版本的jquery）

$.post("一般處理程序路徑",{以字典的形式傳遞參數(shù)},function(data,status){``````});

jquery中的基本選擇器操作；

首先創(chuàng)建數(shù)據(jù)庫“T_article”：

主鍵設(shè)置自增；

然后創(chuàng)建一個強類型的DataSet。

接著創(chuàng)建一個“無刷新評論.aspx”頁面：

頁面代碼如下：

<div>

  <h2>文章：</h2>

  <p>this a text!this a text!this a text!this a text!this a text!this a text!this a text!this a text!

  this a text!this a text!this a text!this a text!this a text!this a text!this a text!this a text!this a text!

  this a text!this a text!this a text!this a text!this a text!this a text!</p>

  <ul id="pinglunlist">

  </ul>

</div>

<textarea id="msg" style="margin-left:20px;" cols="40" rows="10"></textarea>

<input id="btnpinglun" type="button"

  value="評論" />

然后創(chuàng)建兩個一般處理程序WSXPL.ashx（用來插入數(shù)據(jù)的處理程序）和WSXPL1.ashx（用來獲取所有評論數(shù)據(jù)的處理程序）；

WSXPL.ashx中的代碼如下：

public void ProcessRequest(HttpContext context)

{

  context.Response.ContentType = "text/plain";

  string msg = context.Request["msg"];

  new T_articleTableAdapter().Insert(context.Request.UserHostAddress, msg, DateTime.Now); //創(chuàng)建一個強類型的實例，然后調(diào)用Insert()函數(shù)插入；

  context.Response.Write("ok");

}

WSXPL1.ashx中的代碼如下：

public void ProcessRequest(HttpContext context)

{

  context.Response.ContentType = "text/plain";

  var datas = new T_articleTableAdapter().GetData(); //返回的是一個DataTable

  StringBuilder sb = new StringBuilder(); //創(chuàng)建StringBuilder更加方便的搜集數(shù)據(jù)

  foreach (var data in datas)   //用foreach方法遍歷DataTable

  {//實現(xiàn)字符串的拼接；每行數(shù)據(jù)用$隔開，每行數(shù)據(jù)的每個元素用|隔開；有利于前臺解析數(shù)據(jù)；

    sb.Append(data.ipaddress).Append("|").Append(data.msg).Append("|").Append(data.posttime).Append("$");

  }

  context.Response.Write(sb);

}

做完這些步驟，操作數(shù)據(jù)庫的部分就已經(jīng)完成了?，F(xiàn)在只要在前臺把一般處理程序返回的數(shù)據(jù)解析一下并附加的相應(yīng)的位置就可以了！

首先在前臺引用“jquery-1.4.2.js”jquery庫；然后開始編寫js腳本；

$(function () {

      $.post("WSXPL1.ashx", function (data, status) { //通過WSXPL1.ashx獲取所有的評論內(nèi)容

        if (status == "success") {

          var result = data.split("$");  //按照$分割字符串

          for (var i = 0; i < result.length - 1; i++) {

            var msg = result[i];

            var line = msg.split("|");   //按照|分割字符串

            var pinglun = $("<li>用戶ID：" + line[0] + "； 評論內(nèi)容：" + line[1] + "； 評論時間：" + line[2] + "</li>");

            $("#pinglunlist").append(pinglun); //把得到的評論結(jié)果追加到ul元素上

          }

        }

        else {

          alert("ajax錯誤！");

        }

      })

      $("#btnpinglun").click(function () {  //設(shè)置btn事件

        var msg = $("#msg").val();

        $.post("ashx/WSXPL.ashx", { "msg": msg }, function (data, status) {

          if (status == "success") {

            if (data == "ok") {

              $.post("WSXPL1.ashx", function (data, status) { //為了實現(xiàn)評論的時候評論內(nèi)容會自動的添加到ul上

                if (status == "success") {

                  var result = data.split("$");

                  var msg = result[result.length - 2];    //獲取最后一條評論

                  var line = msg.split("|");

                  var pinglun = $("<li>用戶ID：" + line[0] + "； 評論內(nèi)容：" + line[1] + "； 評論時間：" + line[2] + "</li>");

                  $("#pinglunlist").append(pinglun);   //把最后一條評論追加到ul上

                }

                else {

                  alert("ajax錯誤！");

                }

              })

              alert("評論成功！");

            }

            else {

              alert("評論失?。?);

            }

          }

        })

      })

    })

做完這些直接運行就可以了！

以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助。