<button> не работает в IE8

Question

У меня есть несколько кнопок на моем веб-сайте, использующих тег кнопки, и хотя они хорошо отображаются на IE8, они не кликабельны (нажатие на них не отправляет пользователя на новый URL).Есть ли какие-либо решения, чтобы исправить это для IE?Это потому что я оборачиваю кнопку в тег?Это потому, что я использую имя класса "button"?

Код:

<a href="product_home.html">
<button class="button green big_button">Learn more</button>
</a> 

Answer 1

Ваша разметка неверна, IE здесь не виноват. Кнопка - это элемент формы, который означает, что для нее требуется форма вокруг точки, куда должен быть отправлен пользователь - обертывание кнопки в тег ссылки не достаточно и не совсем правильно, на самом деле я не думаю, что оно должно работать где-то, не даже в других браузерах.

Чтобы узнать больше о правильном использовании <button/>, посетите XHTML Ссылка: кнопка

Answer 2

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

<button onclick="location.href='http://www.google.com'">This is a button to google</button>

Answer 3

Cross Browser - работает в MSIE 8 и FF 24 +

<button onclick="location.href='myscript.php?id=$ID'" type="button">MyLink</button>.

Answer 4

Вы можете попробовать:

<a href="product_home.html" class="button green big_button">Learn more</a> 

или положить кнопку в форме

Answer 5

См. мой другой ответ ;Я думаю, что это современный подход, основанный на jQuery, для исправления этой проблемы для старых IE, без искажения вашей хорошей чистой разметки.

<!--[if lt IE 9]>

<script type="text/javascript">
// IE8 is the new IE6. Patch up /1854735/kak-sdelat-tak-chtoby-href-rabotal-na-knopke-v-ie8
$('button').click(function(){
    document.location = $(this).parents('a').first().prop('href');
});
</script>

<![endif]-->

Answer 6

<a href="product_home.html">
<div class="button green big_button">Learn more</div>
</a> 

Answer 7

пример использования:

<form id="myform" name="myform" action="product_home.html">
  <input id="user" name="user" type="text" value="" />
  <button class="button green big_button" type="submit">Learn more</button>
  <button class="button green big_button" type="reset"><b>reset the form!</b></button>
</form>

<script type="text/javascript">

var myform = document.getElementById('myform');

myform.onsubmit = function()
{
    alert(myform.user.value); 
if (myform.user.value != '') return true;
    return false;
}

</script>