examwin_web/js/page1.js

$(function () {
  const globaldata = {
    // 用户是否登录
    user: true,
    // 登录弹框
    sgin () {
      $("#toast").addClass("show").find("#sgin").addClass("show");
    }
  }
  // 显示区高度
  let ch = document.documentElement.clientHeight || document.body.clientHeight;
  // 实现评论区加载
  let lock = false;
  $(window).scroll(function () {
    if (lock) return false;
    // 滑动区高度
    let sh = document.documentElement.scrollHeight || document.body.scrollHeight;
    // 滑动位置
    let st = document.documentElement.scrollTop || document.body.scrollTop;
    let c = sh * 1 - ch * 1 - st * 1;
    if (c == 0) {
      lock = true;
      $(".comment>.loading").addClass("show")
      setTimeout(function (
      ) {
        $(".comment>.loading").removeClass("show");
        data().then(res => {
          if (res) {
            $(".comment>.nodata").addClass("show");
          }
          lock = res;
        });
      }, 2000)
    }
  })
  // 阅读量问题

  // 评论区
  function data () {
    // 请求 根据请求改变内容 唯一标识 data-userid="1" data-good="false"
    let com = `<div class="user" data-good="false" data-userid="1" >
    <div class="u-img"><img src="./imgs/qq.png" alt="" class="img"></div>
    <div class="u-content">
      <div class="u-flex">
        <div class="u-name">QQ官方</div>
        <div class="u-fabulous" data-gods="1"><span>0</span><i data-gods="1" style="margin-left:5px" class="glyphicon glyphicon-thumbs-up"></i></div>
      </div>
      <div class="u-detail">
        对此，广东警官学院表示，其普通高等教育(全日制)招生工作严格执行教育部的“阳光高考”规定和工作程序，不以任何形式承诺录取，不因任何理由降低标准录取。学校从未委托任何个人、中介组织或招生机构开展提前招生、高职扩招等宣
      </div>
      <div class="u-flex">
        <div class="u-date">2020-12-15</div>
        <div data-gods="2"  class="u-report">举报</div>
      </div>
    </div>
  </div>`;
    return new Promise(resolve => {
      $("#detail").append(com);
      //评论点赞 登录状态 请求
      let lists = $("#detail>.user");
      // 模拟无信息加载情况
      if (lists.length == 10) {
        resolve(true)
      }
      for (let i = 0; i < lists.length; i++) {
        $(lists[i]).unbind("click");
        $(lists[i]).click(function (e) {
          if (!globaldata.user) {
            globaldata.sgin();
            return false
          }
          let userid = $(this).data("userid");
          let lock = $(this).data("good");
          let gods = e.target.dataset.gods;
          if (gods == 1) {
            let $i = $(this).find("i");
            let $span = $(this).find("span");
            let num = $span.text();
            if (!lock) {
              $i.addClass("color");
              $(this).data("good", true);
              $span.text(num * 1 + 1);
            } else {
              $i.removeClass("color");
              $(this).data("good", false);
              $span.text(num * 1 - 1);
            }
            return false;
          }
          if (gods == 2) {
            $("#toast").addClass("show").find("#report").addClass("show").data("userid", userid);
          }
        })
      }
      resolve(false);
    })
  }
  // 发表评论 登录状态 请求
  $("#comment>.comment>.nocomment").click(function () {
    if (!globaldata.user) {
      globaldata.sgin();
      return false
    }
    // $(this).addClass("noshow");
    $("#toast").addClass("show")
  })
  // 阅读点赞 登录状态 请求
  $("#read>.good").click(function () {
    if (!globaldata.user) {
      globaldata.sgin();
      return false
    }
    let $i = $(this).find("i");
    let $span = $(this).find("span");
    let num = $span.text();
    let lock = $i.data("good");
    if (!lock) {
      $i.addClass("color");
      $i.data("good", true);
      $span.text(num * 1 + 1);
    } else {
      $i.removeClass("color");
      $i.data("good", false);
      $span.text(num * 1 - 1);
    }
  })

  // 举报事件
  $("#report").click(function (e) {
    let $that = $(this);
    let lis = $that.find("li");
    let i = Array.prototype.slice.call(lis).indexOf(e.target);
    alert("点击举报" + i)
  })
})