16.11.2013, 19:50
|
|
Новичок на форуме
|
|
Регистрация: 16.11.2013
Сообщений: 7
|
|
|
Событие focus в JavaScript
Помогите пожалуйста сделать такую вещь!
На плоскости заданы координаты трех точек. Напишите сценарий, который вычисляет площадь треугольника (использовать событие Focus).
Мне просто надо понять как это работает на примере, а то не доходит никак))
|
|
16.11.2013, 20:55
|
|
Профессор
|
|
Регистрация: 07.11.2013
Сообщений: 4,662
|
|
Создается форма для ввода координат:
1 координата - input x, input y
2 координата - input x, input y
3 координата - input x, input y
Кнопка, на которую вешается событие onfocus, при наступлении которого вычисляется площадь треугольника по координатам его вершин, введенных в поля инпутов формы и выводится результат.
Вот так это работает  |
|
16.11.2013, 21:10
|
|
Новичок на форуме
|
|
Регистрация: 16.11.2013
Сообщений: 7
|
|
|
Т.е. надо создать кнопку на которую надо нажать чтобы вывелся результат? Или как?
|
|
16.11.2013, 22:17
|
 |
Профессор
|
|
Регистрация: 23.06.2011
Сообщений: 1,165
|
|
|
Alexzord,
Событие onfocus возникает, когда элемент получает фокус при навигации табуляцией или щелчком мыши.
Применимо к: a, area, label, input, select, textarea, button
|
|
16.11.2013, 23:06
|
|
Новичок на форуме
|
|
Регистрация: 16.11.2013
Сообщений: 7
|
|
Сообщение от BETEPAH
|
Alexzord,
Событие onfocus возникает, когда элемент получает фокус при навигации табуляцией или щелчком мыши.
Применимо к: a, area, label, input, select, textarea, button
|
BETEPAH,
<!DOCTYPE html>
<HTML>
<HEAD>
<meta charset ="windows-1251">
<title>Обработка значений из формы</title>
<script language="JavaScript">
function S (Ax, Ay, Bx, By, Cx, Cy)
{
var s=math.abs(1/2(Ax-Cx)(By-Cy)-(Bx-Cx)(B2-C3));
return s
}
</script>
</HEAD>
<BODY>
<P>Пример сценария со значениями из формы</P>
<FORM name="form1">
Ax: <input type="text" size=5 name="st1"><hr>
Ay: <input type="text" size=5 name="st2"><hr>
Bx: <input type="text" size=5 name="st3"><hr>
By: <input type="text" size=5 name="st4"><hr>
Cx: <input type="text" size=5 name="st5"><hr>
Cy: <input type="text" size=5 name="st6"><hr>
<input onfocus="S(document.form1.st1.value, document.form1.st2.value, document.form1.st3.value, document.form1.st4.value
, document.form1.st5.value, document.form1.st6.value)">
</FORM>
</BODY>
</HTML>
Что тут не так?
|
|
16.11.2013, 23:21
|
|
Профессор
|
|
Регистрация: 23.06.2011
Сообщений: 1,165
|
|
|
Сообщение от Alexzord
|
|
Что тут не так?
|
Много чего. И все в одной строчке
|
Сообщение от Alexzord
|
|
var s=math.abs(1/2(Ax-Cx)(By-Cy)-(Bx-Cx)(B2-C3));
|
math.abs - не так,
умножения не так
B2, C3 - это вообще откуда?
ну и учитывайте, что .value вернет строчные значения |
|
17.11.2013, 00:18
|
|
Новичок на форуме
|
|
Регистрация: 16.11.2013
Сообщений: 7
|
|
|
Сообщение от Alexzord
|
BETEPAH,
Ой, умножения и В2 С3 это я просто тупанул, забыл) просто формула с инета, скопировал, недописал. Спасибо!
<HEAD>
<script language="JavaScript">
function S (Ax, Ay, Bx, By, Cx, Cy)
{
var s=math.abs(1/2*((Ax-Cx)*(By-Cy)-(Bx-Cx)*(By-Cy)));
return s
}
</script>
</HEAD>
<BODY>
<P>Пример сценария со значениями из формы</P>
<FORM name="form1">
Ax: <input type="text" size=5 name="Ax"><hr>
Ay: <input type="text" size=5 name="Ay"><hr>
Bx: <input type="text" size=5 name="Bx"><hr>
By: <input type="text" size=5 name="By"><hr>
Cx: <input type="text" size=5 name="Cx"><hr>
Cy: <input type="text" size=5 name="Cy"><hr>
<input type="text" width=30px name="rezult" onfocus="S(document.form1.Ax.value, document.form1.Ay.value, document.form1.Bx.value, document.form1.By.value
, document.form1.Cx.value, document.form1.Cy.value)">
</FORM>
|
Можете еще подсказать что в выделенной части у меня неправильно? Если value возвращает строчные, то их в числа переводить надо что ли? Я просто в 9 классе учусь, нам мало что объясняют, а задают много, надо врубиться в то, как эти события работают. Остальное вроде исправил. Спасибо
Последний раз редактировалось Alexzord, 17.11.2013 в 00:23.
|
|
17.11.2013, 00:21
|
|
Профессор
|
|
Регистрация: 07.11.2013
Сообщений: 4,662
|
|
Alexzord, опять с формулой накосячили, к тому же, результат площади s у вас никуда не выводится.
<input type="text" name="result" onfocus="S(document.form1.st1.value, document.form1.st2.value, document.form1.st3.value, document.form1.st4.value, document.form1.st5.value, document.form1.st6.value)">
function S (Ax, Ay, Bx, By, Cx, Cy) {
var s = 0.5 * ( Math.abs( (Ax - Cx) * (By - Cy) - ( Bx - Cx) * (Ay - Cy) ) );
document.form1.result.value = s;
}
|
Сообщение от BETEPAH
|
|
ну и учитывайте, что .value вернет строчные значения
|
BETEPAH, знака + в формуле нет, js сам преобразует к числу. Или так на всякий случай преобразнуть
Последний раз редактировалось Rise, 17.11.2013 в 00:49.
|
|
17.11.2013, 00:34
|
|
Новичок на форуме
|
|
Регистрация: 16.11.2013
Сообщений: 7
|
|
Rise, BETEPAH,
Есть! Ура, работало, ребят! Спасибо всем!
|
|
17.11.2013, 00:45
|
|
Профессор
|
|
Регистрация: 07.11.2013
Сообщений: 4,662
|
|
|
Сообщение от Alexzord
|
|
Если value возвращает строчные, то их в числа переводить надо что ли?
|
Всегда введенные данные возвращаются строчными, если не знаешь как преобразуются типы, то при вычислениях приводи к числу (например так var s = 0.5 * ( Math.abs( (+Ax - +Cx) * (+By - +Cy) - (+Bx - +Cx) * (+Ay - +Cy) ) )). В твоем случае можно обойтись без этого. |
|
|
|
