kalinichenkos
Новичок
Дата регистрации:
13.04.2012 21:07:22
Сообщений: 10
Здравствуйте.
Я написал такой html код:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
</head>
<body>
<form>
Ввод текста:
<input type = 'text' name = 't' />
<br />
</form>
Вывод текста:
<script language="JavaScript">
document.write(t);
</script>
</body>
</html>
хотел просто ввести текст, нажать Enter, и этот текст увидеть.
Но после нажатия Enter текст из поля ввода исчезает и на экран не выводится.
Подскажите, пожалуйста, где я ошибся при попытке вывести переменную "t"?
И считается ли текст введенным если я перенес мышку из поля ввода или надо обязательно нажимать Enter?
С уважением, Сергей.
brussens
Мега-мастер
Дата регистрации:
11.10.2011 22:50:07
Сообщений: 438
Помоему эти строки никогда не выведут текст, т.к. вы ничего не передаёте, т.е. никакого события не происходит.
Ваш скрипт выведет текст только при условии введения текста в самом скрипте. К сожалению не обладаю высокими знаниями по JS, т.к. использую исключительно jquery, но азы знаю, и точно могу сказать, что вам стоит ещё раз (если вы уже читали) прочитать статьи по JS на этом сайте.
brussens
Мега-мастер
Дата регистрации:
11.10.2011 22:50:07
Сообщений: 438
И вообще, откуда вы взяли в скрипте переменную t???? Имя формы не является переменной. Для того, что бы что либо выводилось из формы, вам на чистом JS нужно написать не мало строк кода.
kalinichenkos
Новичок
Дата регистрации:
13.04.2012 21:07:22
Сообщений: 10
Спасибо за совет. Я то думал что "t" это имя того что я ввожу. а оказывается нет. и еще думал что событие вввода подразумевается по умолчанию. буду обрабатывать форму.
brussens
Мега-мастер
Дата регистрации:
11.10.2011 22:50:07
Сообщений: 438
По мне, так проще сделать всё на jquery
soffrick
Новичок
Дата регистрации:
11.05.2012 18:08:46
Сообщений: 14
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
<style>
body, html, p {
margin: 5px;
padding: 0;
}
p label {
color: silver;
font-weight: bold;
font-size: 20px;
cursor: pointer;
}
#p2 {
margin-top: 40px;
}
input[type='text'] {
width: 250px;
background-color: lightgray;
}
input[type='button'] {
background-color: gray;
color: white;
font-weight: bold;
width: 50px;
}
input[type='button']:hover {
background-color: silver;
color: black;
cursor: pointer;
}
</style>
</head>
<body>
<p><label for="input"> Ввод текста:</label></p>
<input type="text" id="input" value="Введите текст и нажмите ОК" onfocus="clearinput('input')" />
<input type="button" onclick="changetxt()" value="OK" />
<p id="p2"><label for="output"> Вывод текста:</label></p>
<input type="text" value="И он отобразиться здесь!" id="output" onfocus="clearinput('output')" />
<script>
function changetxt() {
('output').value = document.getElementById('input').value
}
function clearinput(id) {
doc = document.getElementById(id)
if((doc.value == '') || (doc.value == 'И он отобразиться здесь!') || (doc.value == 'Введите текст и нажмите ОК')) {
doc.value = ''
}
}
</script>
</body>
</html>
kalinichenkos
Новичок
Дата регистрации:
13.04.2012 21:07:22
Сообщений: 10
Здравствуйте.
Я вставил Ваш код в файл, но он не полностью работает: два тексовых поля, кнопка, оформление - все есть. но при нажатии на кнопку ничего не происходит. Для проверки сделал кусок между <script> </script> коментарием и результат тот же - все есть но вывода текста не происходит.
soffrick
Новичок
Дата регистрации:
11.05.2012 18:08:46
Сообщений: 14
Попробуйте скрипт разместить перед </head>
kalinichenkos
Новичок
Дата регистрации:
13.04.2012 21:07:22
Сообщений: 10
Спасибо, все заработало.
Разобрался что такое document.getElementById и зачем тег id, затем в функции замены текста написал:
document.getElementById('output').value = document.getElementById('input').value
soffrick
Новичок
Дата регистрации:
11.05.2012 18:08:46
Сообщений: 14
замена текста делается не через value, a через innerHTML
<script>
function changetext(){
document.getElementById('id_of_old_text').innerHTML = 'Новый текст для элемента, в котором может содержаться текст (h1 - h6, p, div, span, и т.д ...)'
}
</script>
А вот замена значения как раз через value
<script>
function changevalue(){
document.getElementById('id_of_old_value').value = 'Новое значение для элемента INPUT'
}
</script>