在 Navbar 引导3.0按钮

我升级了引导程序3.0。和“ a”标签，看起来像 btn (通过类的帮助。Btn)在导航栏上被破坏。

<li>
<a href="<?php echo BASE_PATH; ?>register.php" class="btn btn-primary btn-sm">
<?php echo "<strong>" . _('Bayilik Başvurusu') . "</strong>"; ?>
</a>
</li>

但是它不能正常工作。我认为 Bootstrap 改变了系统。

90797 次浏览
小开

现在，bootstrap 3在导航栏中有这样的按钮:

<button type="button" class="btn btn-default navbar-btn">Sign in</button>

它使用 navbar-btn，所以它知道它在导航栏中。

如果你想成功，这样做:

<li>
<form action="#">
<button class="btn btn-default navbar-btn">Link</button>
</form>
</li>

这样，它仍然起到锚标签的作用。只需将 #更改为您实际希望它去的值。

因此，在这个例子中:

<li>
<form action="<?php echo BASE_PATH; ?>register.php">
<button class="btn btn-default navbar-btn">Link</button>
</form>
</li>
小开

在引导3中，仍然可以将 <a>链接呈现为按钮，但是您必须将它们包含到 <form>中。此外，<a>应该包括 navbar-btn类。

<li>
<form>
<a href="#" class="btn btn-primary btn-sm navbar-btn">
register
</a>
</form>
</li>
小开

问题是，用于在导航栏中设置锚定样式的选择器是: .nav > li > a，这意味着它的优先级高于。Navbar-btn.

您可以通过将它像 span 一样包装在另一个标记中来进行修复。我认为不应该像其他人建议的那样使用表单标记，因为它根本就不是一种表单。

小开
最佳答案

把 <p class="navbar-btn">绕在 <a class="btn">上:

<nav class="navbar navbar-default navbar-fixed-top">
<div class="container">
<ul class="nav navbar-nav">
<li>
<p class="navbar-btn">
<a href="#" class="btn btn-default">I'm a link button!</a>
</p>
</li>
</ul>
</div>
</nav>

http://jsfiddle.net/lachlan/398kj/

截图:
Bootstrap link button in navbar

小开

Http://learnangular2.com/events/

事件对象

若要捕获事件对象，请在模板的事件回调中将 $event 作为参数传递:

<button (click)="clicked($event)"></button>

这是修改事件的一种简单方法，比如调用 proventDefault:

@Component(...)
class MyComponent {
clicked(event) {
event.preventDefault();
}
}

提交答案