vue中检测敏感词，锚点

最新推荐文章于 2024-05-15 14:18:12 发布

weixin_30663391

最新推荐文章于 2024-05-15 14:18:12 发布

阅读量595

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/myfirstboke/p/9288898.html

版权

当发布文章的时候，标题有敏感词

则检测有敏感词的接口成功的时候，写锚点

eg:

_this
  .$alert("检测到标题有敏感词，请修改后再发布", "提示", {
    cancelButtonText: "取消",
    confirmButtonText: "确定",
    showCancelButton: false,
    customClass: "applySuccessBox",
    cancelButtonClass: "cancelButtonClass",
    confirmButtonClass: "confirmButtonClass",
    showClose: false,
    center: true,
    lockScroll: false
  })
  .then(() => {
 var anchor = _this.$el.querySelector('#myTitle')
    document.body.scrollTop = anchor.offsetTop
这里应该再加一句话

document.documentElement.scrollTop = anchor.offsetTop


  })
  .catch(() => {});
在标题那里加个id=

myTitle
就可以了

*****************************************************************************************************************

上面这么做有bug，360急速模式可以滚动，但是谷歌切没法滚动，这就尴尬了啊

那是应为

谷歌浏览器只认识document.body.scrollTop;

注：标准浏览器是只认识

document.documentElement.scrollTop的，但chrome虽然我感觉比firefox还标准，但却不认识这个，在有文档声明时，chrome也只认识document.body.scrollTop
因为document.body.scrollTop与document.documentElement.scrollTop两者有个特点，就是同时只会有一个值生效
经过我实验谷歌只认识

document.documentElement.scrollTop
其他标准认识

document.body.scrollTop

区别在于
body是DOM对象里的body子节点，即 <body> 标签； 
documentElement 是整个节点树的根节点root，即<html> 标签； 
所以兼容写法

var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
当你定义一个id作为锚点（能拿到苗点到顶部距离），点击时要跳到苗点的话就用
vue 中

let anchor = _this.$el.querySelector('#myTitle')

document.documentElement.scrollTop = anchor.offsetTop

document.body.scrollTop = anchor.offsetTop

转载于:https://www.cnblogs.com/myfirstboke/p/9288898.html

weixin_30663391

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫