如何创建一个HTML按钮,其作用类似于同一页面上项目的链接?

如何创建一个HTML按钮,其作用类似于同一页面上项目的链接?,第1张

概述我想创建一个HTML按钮,其作用类似于同一页面上项目的链接.因此,当您单击该按钮时,它会重定向到同一页面上的项目.我怎样才能做到这一点? (我会将解决方案限制为HTML,CSS和JavaScript,因为目前我没有使用任何其他语言)当前按钮(Bootstrap):<a class='btn btn-large btn-primary' href=''&

我想创建一个HTML按钮,其作用类似于同一页面上项目的链接.因此,当您单击该按钮时,它会重定向到同一页面上的项目.

我怎样才能做到这一点? (我会将解决方案限制为HTML,CSS和JavaScript,因为目前我没有使用任何其他语言)

当前按钮(bootstrap):

最佳答案这假设您不是在谈论向下滚动到常规锚点,而是想要滚动到页面上的实际HTML元素.

我不确定jQuery是否适合你,但如果你使用Bootstrap,我想它确实如此.如果是这样,您可以绑定到按钮的“单击”事件,并在那里放置一些javascript代码来处理滚动.通常,您可以使用“data”属性(例如data-scroll =“my-element-id”)将链接/按钮与要滚动到的元素相关联.

如果没有jQuery,你必须创建一个包含所描述代码的函数,并放入一个引用你的函数的onclick属性,并将“this”作为参数传递给你的函数,这样你就可以获得对该链接的引用/ button元素调用它.

要使用实际滚动到相应元素的代码,请查看以下文章:

How to go to a specific element on page?

没有jquery的简单示例:

ollbutton" data-scroll="#somethingonpage"  onchange="scrollto(this);">something on page

使用jquery:

ollbutton" data-scroll="#somethingonpage">something on page

注意:如果你真的想要一个“按钮”而不是“链接”,你可以真正使用任何元素并使其可点击,例如:

总结

以上是内存溢出为你收集整理的如何创建一个HTML按钮,其作用类似于同一页面上项目的链接?全部内容,希望文章能够帮你解决如何创建一个HTML按钮,其作用类似于同一页面上项目的链接?所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址:https://www.54852.com/web/1126240.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2022-05-30
下一篇2022-05-30

发表评论

登录后才能评论

评论列表(0条)