Как установить ссылку на кнопку с бутстрапом?

Как поставить ссылку на кнопку с бутстрапом?

в документации по загрузке есть 4 метода:

<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">

Первый для меня не работает, ни одна кнопка не показывает, просто текст со ссылкой, есть ощущение, что она использует тему im.

Вторая показывает кнопку, которую я хочу, но что делает код, нажимая кнопку на другой странице при нажатии?

Приветствия

Ответ 1

Вы можете вызвать функцию по событию нажатия кнопки.

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

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

ИЛИ Используйте этот код

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

Ответ 2

Если вам действительно не нужен элемент кнопки, просто переместите классы в обычную ссылку:

<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>

И наоборот, вы также можете изменить кнопку, чтобы она выглядела как ссылка:

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

Ответ 3

Самое простое решение - это первый из ваших примеров:

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

Причина, по которой это не работает для вас, скорее всего, как вы говорите, проблема в теме, которую вы используете. Нет причин прибегать к раздутой дополнительной разметке или встроенному Javascript для этого.

Ответ 4

Еще один трюк, позволяющий правильному цвету ссылок внутри разметки <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>

Имейте в виду, что в bs4 beta, например, btn-primary-outline изменен на btn-outline-primary

Ответ 5

Вот как я решил

   <a href="#" >
      <button type="button" class="btn btn-info">Button Text</button>
   </a>

Ответ 6

Объединяя приведенные выше ответы, я нахожу простое решение, которое, вероятно, тоже поможет вам:

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

просто добавив встроенный JS-код, вы можете преобразовать кнопку в ссылку и сохранить свой дизайн.

Ответ 7

Вы можете просто добавить следующий код;

<a class="btn btn-primary" href="#" onclick="location.href='http://localhost:8080/Home'; return false;" role="button">Home Page</a>