Форум

bugagawenka · #1 (**permalink**) 19.01.2015, 22:10

Вот такой код.
Проблема возникает в IE 8. Подскажите пожалуйста, как можно исправить?

<form onsubmit="return false;"
oninput="document.getElementById('rez').innerHTML 
= parseFloat(document.getElementById('a').value) *
parseFloat(document.getElementById('b').value) * 2;
">
<p>А: <input id="a" type="number"></p> 
<p>Б: <input id="b" type="number"></p>
<p>Рез: <output id="rez"></output></p>
</form>

bugagawenka · #2 (**permalink**) 19.01.2015, 22:29

Сообщение от Rise

bugagawenka, тыц

Спасибо

Ещё повоюем =)))

danik.js · #3 (**permalink**) 21.01.2015, 01:26

Rise, неа.
1. В IE8 нет события input (есть близкое propertychange, но оно не всплывает. Можно тупо юзать change или keyup)
2. Элемент <output> имеет текстовое содержимое (textContent). Его можно изменять. Причем value - это практически его псеводним. (https://html.spec.whatwg.org/multipa...output-element)

Rise, так что можно делать output.innerHTML или appendChild(textNode) - и это кроссбраузерно.

danik.js · #4 (**permalink**) 21.01.2015, 10:35

Хм. Я раньше считал что html5shim в IE нужен только для того, чтобы стили применились к новым тегам. Оказывается проблема не только в стилях, но и в парсинге - без shim'а элементы парсятся как пустые (то есть как <input>). Соответственно, innerHTML к ним не применим.

Но это очень просто исправить. Этот код будет работать в IE8:

<!DOCTYPE html>
<script>
	document.createElement('output');
</script>
<body>
<form onsubmit="return false;"
onkeyup="document.getElementById('rez').innerHTML
= parseFloat(document.getElementById('a').value) *
parseFloat(document.getElementById('b').value) * 2;
">
<p>А: <input id="a" type="number"></p>
<p>Б: <input id="b" type="number"></p>
<p>Рез: <output id="rez"></output></p>
</form>

Либо подключить html5shim.

Форум

Справочник

Discord чат

Курсы javascript