Jak umieścić link na przycisku z bootstrapem?

Question

Jak umieścić link na przycisku z bootstrapem?

są 4 metody bootstrap dokumentacji:

<a href="#" class="btn btn-info" role="button">Link Button</a> 
<button type="button" class="btn btn-info">Button</button> 
<input type="button" class="btn btn-info" value="Input Button"> 
<input type="submit" class="btn btn-info" value="Submit Button"> 

Pierwszy z nich nie działa dla mnie, nie pokazuje przycisków, tylko tekst z linkiem, mają poczucie jego tematem im przy.

Druga pokazuje przycisk, który jest tym, czego chcę, ale jaki jest kod, który powoduje, że po kliknięciu link przycisku do innej strony?

Cheers

Answer 1

można wywołać funkcję po kliknięciu przypadku przycisku.

<input type="button" class="btn btn-info" value="Input Button" onclick=" relocate_home()"> 

<script> 
function relocate_home() 
{ 
    location.href = "www.yoursite.com"; 
} 
</script> 

LUB użyć tego kodu

<input type="button" class="btn btn-info" value="Input Button" onclick="location.href = 'http:\\www.google.com';"> 

Answer 2

Jeśli naprawdę nie trzeba element przycisk, po prostu przenieść na zajęcia do zwykłego linku:

<div class="btn-group"> 
    <a href="/save/1" class="btn btn-primary active"> 
     <i class="glyphicon glyphicon-floppy-disk" aria-hidden="true"></i> Save 
    </a> 
    <a href="/cancel/1" class="btn btn-default">Cancel</a> 
</div> 

Odwrotnie, można zmień także przycisk, aby wyglądał jak link:

<button type="button" class="btn btn-link">Link</button> 

Answer 3

Najprostszym rozwiązaniem jest najpierw jeden z twoich przykładów:

<a href="#link" class="btn btn-info" role="button">Link Button</a> 

Powodem nie działa dla Ciebie jest najbardziej prawdopodobne, jako powiedzmy, problem w temacie, którego używasz. Nie ma powodu, aby uciekać się do nadmiarowego dodatkowego znacznika lub wbudowanego Javascriptu.

Answer 4

Kolejny trik, aby uzyskać kolor łącza prawidłowej pracy wewnątrz znaczników <button>

<button type="button" class="btn btn-outline-success and-all-other-classes"> 
    <a href="#" style="color:inherit"> Button text with correct colors </a> 
</button> 

Proszę pamiętać, że w BS4 np beta btn-outline-primary zmieniona na btn-outline-primary

Answer 5

Łącząc powyższe odpowiedzi i znaleźć po prostu rozwiązanie, które prawdopodobnie pomoże ci też:

<button type="submit" onclick="location.href = 'your_link';">Login</button> 

po prostu dodając inline kod JS można przekształcić przycisk w link i utrzymanie jego projekt.