Javascript-форум - Сложение двух чисел не выводится результат

Javascript-форум (https://javascript.ru/forum/)

- Общие вопросы Javascript (https://javascript.ru/forum/misc/)

- - Сложение двух чисел не выводится результат (https://javascript.ru/forum/misc/46387-slozhenie-dvukh-chisel-ne-vyvoditsya-rezultat.html)

Сложение двух чисел не выводится результат

Не получается вывести результат сложения в блоке div, может кто подсказать что не так?

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=windows-1251">
<title> Ввод вывод данных </title>

<script language="javascript">

function slogenie() {

var a=document.vvod.a.value; // получаем данные из формы, значение a
var b=document.vvod.b.value; // получаем данные из формы, значение b
var summ;
summ=parseInt(a)+parseInt(b); //сложение и задаем целочисленный формат а и б с помощью parseInt()
//document.write("сумма " + a + " + " + b + " = " + summ + "<br>"); почему зависает если вывести summ здесь
}
</script>

</head>

<body>

<form name="vvod">
Введи число a
<input name="a" type="text"> <br>
Введи число b
<input name="b" type="text"> <br>
<p><input value="Сумма" name="B1" onclick="slogenie()" type="button"></p>
</form>

<div>

<script>
document.write("сумма " + a + " + " + b + " = " + summ + "<br>"); //почему не выводится в блоке div
</script>

</div>

</body>
</html>

1. document.write
2. </script>

Да действительно был недочет с закрывающимся скриптом. document.write есть, а результата нет. Вопрос остается открытым. Может кто помочь почему так?

Aetae, спасибо за ссылку!

вы смотрите ошибки в консоли там вроде все понятно...
Во первых у меня ругалось на то,что не может найти
document.vvod.a.value; переделал на айдишники
var a=document.getElementById('a').value;
<input id="a" type="text"> <br>
типа так
теперь если раскоментировать первый документ врайт он сработает. в итоге вот так сработает

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=windows-1251">
<title> Ввод вывод данных </title>

<script language="javascript">

function slogenie() {

var a=document.getElementById('a').value; // получаем данные из формы, значение a
var b=document.getElementById('b').value; // получаем данные из формы, значение b
var summ;
summ=parseInt(a)+parseInt(b); //сложение и задаем целочисленный формат а и б с помощью parseInt()
document.write("сумма " + a + " + " + b + " = " + summ + "<br>"); //почему зависает если вывести summ здесь
}
</script>

</head>

<body> 

<form name="vvod"> 
Введи число a
<input id="a" type="text"> <br>
Введи число b
<input id="b" type="text"> <br>
<p><input value="Сумма" name="B1" onclick="slogenie()" type="button"></p>
</form>

<div> 

<script>
//document.write("сумма " + a + " + " + b + " = " + summ + "<br>"); //почему не выводится в блоке div
</script>

</div>





</body>
</html>

а если интересно почему при загрузке страницы не срабатывает вот этот кусок
document.write("сумма " + a + " + " + b + " = " + summ + "<br>"); //почему не выводится в блоке div
то из-за того, что переменные у вас объявлены внутри функции, а отобразить вы их пытаетесь в глобальной области видимости

Нашел ответ на свой вопрос:

"document.write работает только на этапе загрузки страницы, его нельзя вызывать в ответ на какое-нибудь событие. Если document.write вызвать после того, как страница загрузилась, результат во всех браузерах будет примерно одинаков — пустая страница и, возможно, тот текст, который был выведен последним document.write. Поэтому даже не пытайтесь использовать его в ответ на какие-то действия пользователя, только на этапе загрузки страницы."

Но как же тогда вывести результат summ????? на событие onclick

<div id="out"></div> и вместо документ врайта
document.getElementById('out').innerHTML = "сумма " + a + " + " + b + " = " + summ + "<br>";

Спасибо, versoul, теперь работает все как хотелось.

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=windows-1251">
<title> Ввод вывод данных </title>

<script language="javascript">

function slogenie() {

var a=document.getElementById('a').value; // получаем данные из формы, значение a
var b=document.getElementById('b').value; // получаем данные из формы, значение b
var summ;
summ=parseInt(a)+parseInt(b); //сложение и задаем целочисленный формат а и б с помощью parseInt()
//document.write("сумма " + a + " + " + b + " = " + summ + "<br>"); //почему зависает если вывести summ здесь
document.getElementById('out').innerHTML = "сумма " + a + " + " + b + " = " + summ + "<br>";
}
</script>
</head>

<body>

<form name="vvod">
Введи число a
<input id="a" type="text"> <br>
Введи число b
<input id="b" type="text"> <br>
<p><input value="Сумма" name="B1" onclick="slogenie()" type="button"></p>
</form>

<div id="out" padding-left="400px">



</div>

</body>
</html>