Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 24.09.2009, 11:06
Новичок на форуме
Отправить личное сообщение для deerstop Посмотреть профиль Найти все сообщения от deerstop
 
Регистрация: 24.09.2009
Сообщений: 7

Добавление строк в текущий документ
Ситуация:
Есть html-документ, состоящий из маленькой формы - текстовое поле, две радиокнопки, две кнопки (ок и reset). По нажатию на ок запускается функция (во внешнем файле), которая проделывает некоторые операции с текстовым полем и возвращает результат в виде набора строк. Проблема в том, что этот набор строк возникает перегрузкой страницы, а мне хотелось бы, чтобы результат помещался на текущей странице после формы.

У меня есть ощущение, что решение у задачи простое, но поскольку я в этой области новичок, самостоятельный поиск пока результата не дал. Буду благодарен, если кто-то подскажет решение.
Ответить с цитированием
  #2 (permalink)  
Старый 24.09.2009, 11:20
Аватар для Gvozd
Матрос
Отправить личное сообщение для Gvozd Посмотреть профиль Найти все сообщения от Gvozd
 
Регистрация: 04.04.2008
Сообщений: 6,245

http://javascript.ru/tutorial/dom
Ответить с цитированием
  #3 (permalink)  
Старый 24.09.2009, 13:09
Новичок на форуме
Отправить личное сообщение для deerstop Посмотреть профиль Найти все сообщения от deerstop
 
Регистрация: 24.09.2009
Сообщений: 7

Спасибо большое.
Я бегло пробежался (подробно пока нет времени читать) - вроде увидел, где подобные вещи показываются.
Ответить с цитированием
  #4 (permalink)  
Старый 24.09.2009, 22:01
Новичок на форуме
Отправить личное сообщение для deerstop Посмотреть профиль Найти все сообщения от deerstop
 
Регистрация: 24.09.2009
Сообщений: 7

Что-то ничего не получается, видимо не догоняю где-то:

Документ:

<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);
}


Вроде все как указано делаю, но результата нет - новый абзац не добавляется. Может кто-нибудь подсказать, где ошибка?
Ответить с цитированием
  #5 (permalink)  
Старый 24.09.2009, 22:06
Новичок на форуме
Отправить личное сообщение для deerstop Посмотреть профиль Найти все сообщения от deerstop
 
Регистрация: 24.09.2009
Сообщений: 7

Скрипт немного неверно скопировал:

function parse () {
var hr = document.getElementByTagName('hr');
var p = document.getElementsByTagName('p')[0];
var newElem = document.createElement('p');
newElem.innerHTML = 'Новый элемент';
hr.insertBefore(newElem, p);
}
Ответить с цитированием
  #6 (permalink)  
Старый 24.09.2009, 22:23
Отправить личное сообщение для Octane Посмотреть профиль Найти все сообщения от Octane  
Регистрация: 10.07.2008
Сообщений: 3,873

С <hr> непонятно что вы пытаетесь сделать, метода getElementByTagName не существует, сами же в следующей строчке написали правильный вариант.
function parse () {
    var p = document.getElementsByTagName('p')[0];
    var newElem = document.createElement('p');
    newElem.innerHTML = 'Новый элемент';
    p.parentNode.insertBefore(newElem, p);
}
Ответить с цитированием
  #7 (permalink)  
Старый 24.09.2009, 22:30
Аватар для Gvozd
Матрос
Отправить личное сообщение для Gvozd Посмотреть профиль Найти все сообщения от Gvozd
 
Регистрация: 04.04.2008
Сообщений: 6,245

Сообщение от deerstop
var hr = document.getElementByTagName('hr');
var p = document.getElementsByTagName('p')[0];
всматриваться до полного просветления
[spoiler]вы забыли указать индекс для первого списка элементов[/spoiler]
это раз
Сообщение от deerstop
hr.insertBefore(newElem, p);
может все-таки
//если вы хотите поставить перед чертой(черта <hr> не может иметь потомков)
hr.parentNode.insertBefore(newElem, hr);

PS не успел немного
Ответить с цитированием
  #8 (permalink)  
Старый 24.09.2009, 22:35
Новичок на форуме
Отправить личное сообщение для deerstop Посмотреть профиль Найти все сообщения от deerstop
 
Регистрация: 24.09.2009
Сообщений: 7

Переписал функцию Вашим вариантом. Мне понятно, как она работает, но строка по прежнему не добавляется (в firefox она как бы добавляется, но тут же исчезает).
Ответить с цитированием
  #9 (permalink)  
Старый 24.09.2009, 22:49
Аватар для Gvozd
Матрос
Отправить личное сообщение для Gvozd Посмотреть профиль Найти все сообщения от Gvozd
 
Регистрация: 04.04.2008
Сообщений: 6,245

onclick="parse();"
меняем на
onclick="parse();return false;"
таким образом избавляемся от стандартного обработчика события
Ответить с цитированием
  #10 (permalink)  
Старый 24.09.2009, 23:03
Новичок на форуме
Отправить личное сообщение для deerstop Посмотреть профиль Найти все сообщения от deerstop
 
Регистрация: 24.09.2009
Сообщений: 7

Работает!
Спасибо огромное всем!!!
С такой конструкцией вызова функции раньше не сталкивался, не совсем понимаю принцип работы, и это печально. Если не надоел еще, может объясните вкратце. Если надоел - сам постараюсь найти.
В любом случае всем еще раз огромное спасибо.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Динамическое удаление строк таблицы Tankist Events/DOM/Window 16 03.07.2013 16:42
Подскажите, пжлст, как вывести в тот же документ результат ф-ции? LexXxeL Элементы интерфейса 4 13.05.2009 13:26
как открыть документ частично? mirniy Общие вопросы Javascript 3 02.03.2009 18:37
Добавление строк в таблицу stanlee Элементы интерфейса 13 11.06.2008 17:38
поменять цвет у нескольких строк в таблице Root Элементы интерфейса 4 21.04.2008 10:30