如何使用Twitter引导程序点击按钮导航到另一个页面

How do I navigate to another page on button click with Twitter Bootstrap?

本文关键字：导航 另一个 按钮 何使用 Twitter 引导程序      更新时间：2023-09-26

我必须呈现驻留在templates/home.html 中的html页面

我在index.html中有一个按钮作为：

<div id="browse_app">
    <button class="btn btn-large btn-info" type="button">Browse</button>
</div>

我所想做的就是当我点击Browse时，会将我带到home.html

我试着把jQuery写成：

// onClick on 'Browse' load the internal page
$(function(){
    $('#browse_app').click(function(){
        $.load('templates/home.html');
    });
});

但这不起作用，因为加载需要将数据放在当前页面的某个位置

如何点击home.html按钮？

据我所知，您正在使用Twitter Bootstrap。Buttons的文档说明了您的观点：

默认按钮

按钮样式可以应用于应用了.btn类的任何内容。但是，为了获得最佳渲染效果，通常只需要将这些应用于<a>和<button>元素。

这就是你想要的：

<div id="browse_app">
  <a class="btn btn-large btn-info" href="templates/home.html">Browse</a>
</div>

在最坏的情况下，这样按钮的呈现看起来不太好，但链接可以工作。使用JS，最坏的情况会使链接变得无用。

在按钮标签中使用：onclick="window.location='在此处插入HTML文件'"

我之前准备的一个：<button class="btn" style="text-align:inherit" onclick="window.location='./Learn/'">&laquo; About HerdMASTER 4</button>

我想去目录从同一文件夹中的另一个目录学习

这是一个更优雅的解决方案，使用了附带的引导程序类，这意味着你不必将代码破解到你的页面中。我希望有更多关于bootstrap的各种类的功能文档，因为我从上面的代码中了解到了这一点，而不是通过谷歌搜索找到它。

使用此：

$(function(){
    $('#browse_app').click(function(){
        window.location='templates/home.html'
    });
});

使用onclick="window.open（'YourPage.aspx'，'_self'）；"

例如：

<button type="submit" onclick="window.open('YourPage.aspx','_self');" class="btn btn-default">Your Page</button>
相关文章：