• ajax无刷新评论示例

    下面就为大家带来一篇 ajax无刷新评论示例。学习还是有点帮助的，给大家做个参考吧。

    这是留言板的界面，当用户点击提交留言的时候，自动提交到我的留言下面

    留言内容中为空，或者为灰色的“没有填写留言内容”都会弹出 请填写留言内容，当用户填写信息的会在右下角显示当前留言的字数。

    ajax无刷新评论功能 三零网 Q3060.com

    下面是javascript的代码

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    //去掉左右尖括号 并用去掉空格后的字符串替代显示
    function replaceBrackets(id) {
      var inputValue = $("#" + id).val();
      while (inputValue.indexOf("<") != -1) {
        inputValue = inputValue.replace("<", "[");
      }
      while (inputValue.indexOf(">") != -1) {
        inputValue = inputValue.replace(">", "]");
      }
      while (inputValue.indexOf("&") != -1) {
        inputValue = inputValue.replace("&", " ");
      }
      $("#" + id).val(inputValue);
    }
      
    function replaceChar(name, char) {
      var inputValue = $("#" + name).val();
      while (inputValue.indexOf(char) != -1) {
        inputValue = inputValue.replace(char, "");
      }
      return inputValue;
    }
      
    $("#txtMessage").blur(function () {
      $("#txtMessage").val(replaceChar("txtMessage", "<!--"));
      if ($("#txtMessage").val() == "") {
        document.getElementById("txtMessage").style.color = "#8C8C8C";
        $("#txtMessage").val("没有填写留言内容");
        return false;
      }
      replaceBrackets("txtMessage");
      return true;
    });
      
    $("#txtMessage").focus(function () {
      if ($("#txtMessage").val() == "没有填写留言内容") {
        document.getElementById("txtMessage").style.color = "#000000";
        $("#txtMessage").val("");
      }
    });
      
    function txtanum(id, name)  //统计txta的输入字数
    {
      var maxl = 151;
      var num = 150;
      var content = $("#" + id).val();
      content.slice(0, maxl);
      var nowlength = content.length;
      if (nowlength >= 0) {
        if (nowlength < num)
          $("#" + name).text(nowlength);
        else
          $("#" + name).text(num);
      } else
        $("#" + id).val(content.substring(0, maxl - 1));
      
      if (nowlength == 0)
        $("#" + name).text(0);
      
      if (nowlength > num)
        $("#" + id).val(content.substring(0, num));
    }
      
      
    var isSubmit = false;
    $('#subMessage').click(function () {
      
      if (isSubmit) {
        return;
      }
      isSubmit = true;
      if ($("#txtMessage").val() == "没有填写留言内容" || $.trim($("#txtMessage").val()) == "") {
        alert("请输入留言内容！");
        isSubmit = false;
        return;
      }
      $.ajax({
        type: "POST",
        url: app_param.path_context+"/user/member/msgboard/save",
        data: { "context": ($("#txtMessage").val()) },
        error: function () {
          isSubmit = false;
        },
        success: function (data) {
          if (data) {
            addRow(data);
            isSubmit=false;
           $('#zanwu').hide();
            document.getElementById("txtMessage").style.color = "#8C8C8C";
        $("#txtMessage").val("没有填写留言内容");
          } 
        }
      });
      function addRow(messageboard) {
        var table = $("#tblmsg");
        var html = [];
        html.push("<tr>");
        html.push("<td class='m_time'>");
        html.push(messageboard.createDate);
        html.push("</td>");
        html.push("<td>");
        html.push(messageboard.context);
        html.push("</td>");
        html.push("<td style='border-right: 0;' class='m_order_procz'>");
        html.push("<a class='xxx' href='messagereply/"+messageboard.id+"'>查看</a>");
        html.push("</td>");
        html.push("</tr>");
        html = html.join('');
        table.append(html);
      }
      
    });
  • 相关阅读:
    关于使用wcf架构分布式系统的一点想法
    vs2012 远程调试服务器上iis下的程序
    F#定义方法参数
    产生不重复的随机数
    巧在C#中设置多维动态数组，可以动态增加及删除
    C#时间相减
    css控制图片大小的方法
    常用网络命令
    DEDE SQL 常用语句
    未审核文档发布时间的自动更改方法for DEDEcms v5.3(修正版)
  • 原文地址：https://www.cnblogs.com/123456xfxf/p/7442032.html
Copyright © 2020-2023  润新知