列表页面点击分页按钮后页面自动定位到页面顶部

 做一个酒店的列表页面,遇到一个问题,点击下一页后页面定位在分页的地方,用了更好的用户体验,点击下一页后页面定位到顶部。

     

首先想到的是利用HTML锚点:

①:设置一个锚点链接<a href="#PageTop" id="maoDian" >回到顶部</a>;(注意:href属性的属性值最前面要加#)

②:在页面中需要的位置设置锚点<a name="PageTop"></a>;(注意:a标签中要写一个name属性,属性值要与①中的href的属性值一样,不加#)标签中按需填写必要的文字,一般不写内容

锚点设置好了以后又遇到一个新的问题,如何实现在点击下一页后自动定位到页面顶部,而非手动点击“回到顶部”,要实现页面自定定位,我想到利用jQuery的click()方法:

$("#maoDian").click(); 

本以为这样就OK啦,其实不然!!!

直接通过.click()方法是不能触发<a >的跳转事件的,必须通过a的子元素,例如

   <a href="#PageTop" id="maoDian" >

直接调用click()方法无效

$("#maoDian").click();

可以这样:

$("#maoDian").append("<span></span>");

$("#maoDian span").click();

测试通过,万事大吉!!!

猜你喜欢

转载自blog.csdn.net/liangmengbk/article/details/83141053