Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Не работает кнопка (https://javascript.ru/forum/misc/31491-ne-rabotaet-knopka.html)

Женя150 10.09.2012 01:12
Не работает кнопка
 
Функция vvod_elementov(N) описывает кнопку 'Определить значение функции в узле'. При нажатии на эту кнопку вызывается функция Proverka() , которая выводит диалоговое окно с надписью "proverka".

Не работает кнопка, не могу понять в чем дело. Подскажите пожалуйста
Вот код скрипта:

function vvod_elementov(N)
{
var N=N.value;



for (var i=0; i<N; i++)
{

document.write(" Введите х");
document.write(i);
document.write("=");
document.write("<input name=xi >" );

document.write(" <br>");
document.write(" <br>");

document.write("<input type=button value='Определить значение функции в узле' onClick='Proverka()' >" );
document.write(" <br>");
document.write("<br>");
}


}


function Proverka() {
alert("proverka");

}

lord2kim 10.09.2012 01:16
Женя150, document.write полностью переписывает HTML-страницу, если та уже загружена...
document.write

Женя150 10.09.2012 01:19
а как сделать, чтобы заработала?

lord2kim 10.09.2012 01:27
Женя150, а что именно вы хотите сделать?
<html>
<head>
<script>
function vvod_elementov(N)
{
var N=N.value, div = document.getElementById("div");
div.innerHTML = "";


for (var i=0; i<N; i++)
{
div.innerHTML += " Введите х"+i+"=<input name=xi><br><br>";
div.innerHTML += "<input type=button value='Определить значение функции в узле' onClick='Proverka()'><br><br>";
}
}
</script>
</head>
<body>
<div id="div"></div>
<input type="text" id="el" value="2"><input type="button" value="Click" onClick="vvod_elementov(document.getElementById('el'))">
</body>
</html>

Женя150 10.09.2012 11:00
Вообще, я хочу, чтобы при нажатии на кнопку проводились вычисления и результат показывался на экране)
чтобы было f(x0)=
f(x1)=
f(x2)=
и т.д


xi-Math.sin(xi)-0.25 - это функция, значение которой нужно просчитать в каждом узле

<html>
<head>
<script>
function vvod_elementov(N)
{
var N=N.value, div = document.getElementById("div");
div.innerHTML = "";


for (var i=0; i<N; i++)
{
div.innerHTML += " Введите х"+i+"=<input name=xi><br><br>";
div.innerHTML += "<input type=button value='Определить значение функции в узле' onClick='Proverka()'><br><br>";
}
}

function Proverka()
{


for (var i=0; i<N; i++)
{
div.innerHTML += " f(х"+i+")="+xi-Math.sin(xi)-0.25;

}


}
</script>
</head>
<body>
<div id="div"></div>
<input type="text" id="el" value="2"><input type="button" value="Click" onClick="vvod_elementov(document.getElementById('e l'))">
</body>
</html>


Поможете?)

lord2kim 10.09.2012 14:54
Женя150,
<html>
<head>
<script>
function vvod_elementov(N) {
    var N = N.value, div = document.getElementById("el_len"), span, input, but, sub;
    if (!parseInt(N, 10)) { return alert("Введенное значение не является числом!"); }
    else { N = parseInt(N, 10); }
    div.innerHTML = "";

    for (i=0; i < N; i++) {
        span = document.createElement("span");
        input = document.createElement("input");
        input.setAttribute("type", "text");
        input.setAttribute("name", "x"+i);
        but = document.createElement("input");
        but.setAttribute("type", "button");
        but.setAttribute("value", "Определить значение функции в узле");
		but.onclick = (function(i) { return function() { Proverka(this.parentNode, i); } })(i);
		sub = document.createElement("sub");
		sub.appendChild(document.createTextNode(i));
        span.appendChild(document.createTextNode("Введите x"));
		span.appendChild(sub);
        span.appendChild(input);
        span.appendChild(document.createElement("br"));
		span.appendChild(document.createElement("br"));
        span.appendChild(but);
        span.appendChild(document.createElement("br"));
		span.appendChild(document.createElement("br"));
        div.appendChild(span);
    }
}

function Proverka(el, i) {
    var div = document.getElementById("res"), sub;
	if (!parseInt(el.children[1].value)) { return alert("Введенное значение не является числом!"); }
	else { var sin = parseInt(el.children[1].value)-Math.sin(parseInt(el.children[1].value))-0.25;
	/*
	если нужно в градусах то пишем
	var sin = (parseInt(el.children[1].value) * Math.PI / 180)-Math.sin(parseInt(el.children[1].value) * Math.PI / 180)-0.25;
	*/
	}
    div.innerHTML = "";
    sub = document.createElement("sub");
    sub.innerHTML = i;
    div.appendChild(document.createTextNode(" f(x"));
	div.appendChild(sub);
	div.appendChild(document.createTextNode(") = "));
	div.appendChild(document.createTextNode(sin));
}
</script>
</head>
<body>
<input type="text" id="el" value="2"><input type="button" value="Click" onClick="vvod_elementov(document.getElementById('el'))">
<div id="el_len"></div>
<div id="res"></div>
</body>
</html>

Женя150 10.09.2012 17:56
круто!!!!!!!!!!!!!! спасибо огромное!!!!

а как зафиксировать на экране значение? ну чтобы не пропадало f(x0) при вычислении f(x1) ?

lord2kim 10.09.2012 23:23
Женя150, закоментируйте строку 42
//div.innerHTML = "";

Женя150 11.09.2012 23:49
Ура, работает как надо! Огромное спасибо!

Женя150 17.09.2012 14:58
Код работает, мне все нравится, только я хотела бы разъяснить некоторые моменты:

1) input = document.createElement("input"); - это создается класс input, в котором создается новый элемент input

input.setAttribute("type", "text"); - в классе input вызывается метод, устанавливающий значение атрибута и значение text

я правильно понимаю?

2) sub.appendChild(document.createTextNode(i)); - в класс sub добавляется новый элемент к детям существующего элемента

существующий элемент это sub? А "дети" в данном примере это что?

3) document.createTextNode(i) - создается текст "i"

в 44 строке : sub.innerHTML = i; - присваивает HTML i

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

4) строка 18:

в классе but вызывается метод Onclick, к которому привязана функция (i), которая возвращает функцию Proverka?

не очень понятно про функцию (i)

Proverka(this.parentNode, i) -что такое parentNode?


but.onclick = (function(i) { return function() { Proverka(this.parentNode, i); } })(i);

интересует вот это (i) в конце.
Получается, что структура вызова выглядит так:
onclick=(...)(i) ?


5) поясните пожалуйста строку 35.

el.children[1]
-то, что в квадратных скобках, это же ,буква "l"?
и почему скобки квадратные? это массив?

6) почему-то при вводе в качестве значения узла "0" выдается сообщение, что "Введенное значение не является числом".
Ноль-это все же число=)

7) при вводе узлов подписывается x0, x1 ... цифры записаны шрифтом поменьше как индексы.
Очень удобно, мне интересно, в каком месте в коде прописан тот момент, что цифры должны быть другого размера?


Разъясните пожалуйста:)

lord2kim 17.09.2012 15:41
Женя150,
1) createElement создает новый элемент с указанным тегом
setAttribute создает атрибут (первый аргумент) и устанавливает ему значение (второй аргумент)

2) appendChild вставляет в документ DOM-узел для его отображения
в данном случае к элементу sub добавляется новый текстовый узел (дитЁ) с указанным текстом

3) можно было использовать и innerHTML

4)

5) это цифра 1...
children - массив дочерних узлов, т.е. в данном случае это второй дочерний узел

6) первый дочерний узел в данном случае это элемент sub, у которого нет свойства value, второй - это текстовое поле input

7) 19,20,22 sub


Часовой пояс GMT +3, время: 00:49.