锚点定位且不改变url

html

事件触发
<li v-for="(item,index) in couponsList.swaps" :key="index" @click="toTegional(index)">{{regionalList[index]}}</li>

1
2
锚点埋藏
<div v-for="(item,index) in couponsList.swaps" :key="index" :id="'price'+index">

1
2
JavaScript

toTegional(index) {
let id = '#price' + index;
document.querySelector(id).scrollIntoView(true);
},

锚点定位且不改变url地址的更多相关文章

  1. asp.net core 2.2 根据PC端和移动端自动显示不同视图而不改变url地址

    1.添加HttpRequest扩展方法 public static class RequestExtensions { //regex from http://detectmobilebrowsers ...

  2. 使用锚点定位不改变url同时平滑的滑动到锚点位置,不会生硬的直接到锚点位置

    使用锚点定位不改变url同时平滑的滑动到锚点位置,不会生硬的直接到锚点位置 对前端来说锚点是一个很好用的技术,它能快速定位到预先埋好的位置. 但是美中不足的是它会改变请求地址url,当用户使用了锚点的 ...

  3. thinkphp的url地址区分大小写?

    在默认情况下: 在访问url地址的时候, 其中的 Action类名 即: 模块名称 是区分大小写的. (只有模块名, 即控制器名称) 可以根据设置 'URL_CASE_INSENSITIVE' =&g ...

  4. 获取网页URL地址及参数等的两种方法(js和C#)

    转:获取网页URL地址及参数等的两种方法(js和C#) 一 js 先看一个示例 用javascript获取url网址信息 <script type="text/javascript&q ...

  5. 通过history.pushState无刷新改变url

    通过history.pushState无刷新改变url 背景 在浏览器中改变地址栏url,将会触发页面资源的重新加载,这使得我们可以在不同的页面间进行跳转,得以浏览不同的内容.但随着单页应用的增多,越 ...

  6. history.pushState无刷新改变url

    通过history.pushState无刷新改变url 背景 在浏览器中改变地址栏url,将会触发页面资源的重新加载,这使得我们可以在不同的页面间进行跳转,得以浏览不同的内容.但随着单页应用的增多,越 ...

  7. 图片的base64编码通过javascript生成图片--当前URL地址的二维码应用

    前面的话 在电脑端发现一篇好的博文,想在手机上访问.这时,就必须打开手机浏览器输入长长的URL地址才行,非常不方便.如果在博客标题的后面跟一张小的图片,点击该图片后,出现一张二维码的大图,然后再通过手 ...

  8. html页面内锚点定位及跳转方法总结

    1.最简单的方法是锚点用<a>标签,在href属性中写入DIV的id.如下: <!DOCTYPE html><html><head><style& ...

  9. 【面试题】如何去掉vue的url地址中的#号?及其原理?

    如何去掉vue的url地址中的#号?及其原理? 点击打开视频讲解更加详细 如何去掉vue的url地址中的#号? import Vue from 'vue'; import VueRouter from ...

随机推荐

  1. [BZOJ3456]城市规划:DP+NTT+多项式求逆

    写在前面的话 昨天听吕老板讲课,数数题感觉十分的神仙. 于是,ErkkiErkko这个小蒟蒻也要去学数数题了. 分析 Miskcoo orz 带标号无向连通图计数. \(f(x)\)表示\(x\)个点 ...

  2. 理解BFC以及BFC相关布局问题解决

    写页面时会遇到: 子元素float父元素的高度不会撑开; 在布局时,box1and box2,其中box1 float:left,这是box2会在box1下面,(如果文字过多就会形成文字环绕效果),但 ...

  3. for aws associate exam

    Topics which I read based on the previous forum discussions Amazon DynamoDB January 2016 Day at the ...

  4. 使用tushare获取股票实时分笔数据延时有多大

    使用tushare获取股票实时分笔数据延时有多大 前几天分享了一段获取所有股票实时数据的代码,有用户积极留言,提出一个非常棒的问题:如果数据本生的延时非常严重,通过代码获取数据再快又有什么用呢? 一直 ...

  5. hibernate映射简单实例

    1创建数据库: --班级表 create table grade ( gid number primary key, --班级ID gname varchar2(50), --班级名称 gdesc v ...

  6. oracle 查看并行sql语句的并行数量和如何开并行

    1.执行sql:select /*+ parallel(a,4) */ * from tf_f_user a where rownum<100000; 2.如何查看该sql语句的并行数量: se ...

  7. Openstack_通用模块_Oslo_vmware 创建 vSS PortGroup

    目录 目录 vSS vSSPG vSphere SDK 中相关的网络对象 创建 vSS PortGroup vSS & vSSPG vSS(Standard vSwitch 标准交换机) 为在 ...

  8. Apache监控调优

    apache是一款对静态资源处理得比较好的中间件,但是对动态请求处理得不是很好,tomcat则正好相反. apache运用得比较多得工作模式主要是Prefork和Worker两种模式 1.Prefor ...

  9. excel 字母变大写 宏

    Sub ConvertToUpperCase() Dim Rng As Range Worksheets("Sheet1").UsedRange.Select For Each R ...

  10. nginx详解反向代理,负载均衡,LNMP架构上线动态网站

    1.nginx介绍 nginx.org Nginx是俄罗斯人编写的十分轻量级的HTTP服务器,Nginx,它的发音为“engine X”,是一个高性能的HTTP和反向代理服务器,同时也是一个IMAP/ ...