Добавление строк в текущий документ
Ситуация:
Есть html-документ, состоящий из маленькой формы - текстовое поле, две радиокнопки, две кнопки (ок и reset). По нажатию на ок запускается функция (во внешнем файле), которая проделывает некоторые операции с текстовым полем и возвращает результат в виде набора строк. Проблема в том, что этот набор строк возникает перегрузкой страницы, а мне хотелось бы, чтобы результат помещался на текущей странице после формы. У меня есть ощущение, что решение у задачи простое, но поскольку я в этой области новичок, самостоятельный поиск пока результата не дал. Буду благодарен, если кто-то подскажет решение. |
|
Спасибо большое.
Я бегло пробежался (подробно пока нет времени читать) - вроде увидел, где подобные вещи показываются. |
Что-то ничего не получается, видимо не догоняю где-то:
Документ:
<head>
<title>Пример</title>
<script type="text/javascript" src="script.js"></script>
<style type="text/css">
.radio {
margin-top: 10;
}
.button {
margin-top: 10;
margin-right: 15;
padding: 0 15 0 15;
width: auto;
overflow: visible;
}
</style>
</head>
<body>
<form name="form1">
<input type="text" name="sentence" size="200"><br>
<input type="radio" name="direction" value="начало" checked="true" class="radio">Начало<br>
<input type="radio" name="direction" value="конец">Конец<br>
<input type="submit" name="ok" value="Ok" class="button" onclick="parse();">
<input type="reset" name="ok" value="Отмена" onclick="document.forms.form1.reset()">
</form>
<p>Результат выполнения:<p>
<hr>
</body>
Скрипт:
function parse () {
var hr = document.getElementByTagName('hr');
var p = document.getElementsByTagName('p')[0];
var newElem = document.createElement('p');
newElem = 'Новый элемент';
hr.insertBefore(newElem, p);
}
Вроде все как указано делаю, но результата нет - новый абзац не добавляется. Может кто-нибудь подсказать, где ошибка? |
Скрипт немного неверно скопировал:
function parse () {
var hr = document.getElementByTagName('hr');
var p = document.getElementsByTagName('p')[0];
var newElem = document.createElement('p');
newElem.innerHTML = 'Новый элемент';
hr.insertBefore(newElem, p);
}
|
С <hr> непонятно что вы пытаетесь сделать, метода getElementByTagName не существует, сами же в следующей строчке написали правильный вариант.
function parse () {
var p = document.getElementsByTagName('p')[0];
var newElem = document.createElement('p');
newElem.innerHTML = 'Новый элемент';
p.parentNode.insertBefore(newElem, p);
}
|
Цитата:
[spoiler]вы забыли указать индекс для первого списка элементов[/spoiler] это раз Цитата:
//если вы хотите поставить перед чертой(черта <hr> не может иметь потомков) hr.parentNode.insertBefore(newElem, hr); PS не успел немного |
Переписал функцию Вашим вариантом. Мне понятно, как она работает, но строка по прежнему не добавляется (в firefox она как бы добавляется, но тут же исчезает).
|
onclick="parse();"
меняем на onclick="parse();return false;" таким образом избавляемся от стандартного обработчика события |
Работает!
Спасибо огромное всем!!! С такой конструкцией вызова функции раньше не сталкивался, не совсем понимаю принцип работы, и это печально. Если не надоел еще, может объясните вкратце. Если надоел - сам постараюсь найти. В любом случае всем еще раз огромное спасибо. |
|
Вот теперь всё совсем хорошо и понятно.
Спасибо за ссылку. |
| Часовой пояс GMT +3, время: 15:14. |