VPF::изменить контент динамически - Форум программистов

zoidberg

Дата 23.7.2006, 05:14 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 24
Регистрация: 18.7.2006

Репутация: нет
Всего: 0

сабж...

Код


<script type="text/javascript">
    document.onkeyup = prnt;
    var buffer = "";
    var inpcode = "<input type=\"text\" id=\"in\" /><br />";
    function prnt(ev) {
        if(!ev)ev = window.event;
        var src =  ev.target || ev.srcElement;
        if(src == document.getElementById("in")) {
            buffer = document.getElementById("in").value;
            document.getElementById("magic").innerHTML = inpcode + buffer;
        }
        document.getElementById("in").value = buffer;
        document.getElementById("in").focus();
    }
</script>
<form id="magic">
    <input type="text" id="in" /><br />
</form>

Писал под firefox, а потом подправил под другие браузеры и хлоп... косяки посыпались.
В опере фокус падает в начало строки и получается зеркальный текст. А осел сообщил о "неизвестной ошибке выполнения" в строке 10, символ 4.(че ему не нравится?) Отвратительно. smile

А вся беда из-за innerHTML и обновления всей странички. Есть другие способы?

12345c

Дата 23.7.2006, 07:38 (ссылка)

(нет голосов)

Загрузка ...

Круглый

Профиль
Группа: Vingrad developer
Сообщений: 2018
Регистрация: 26.12.2005
Где: наша не пропадала ?

Репутация: 57
Всего: 101

Вы стираете точку вызова функции onkeyup и удивляетесь, почему она перестала работать smile

zoidberg

Дата 23.7.2006, 15:01 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 24
Регистрация: 18.7.2006

Репутация: нет
Всего: 0

Цитата(12345c @ 23.7.2006, 07:38)

Вы стираете точку вызова функции onkeyup и удивляетесь, почему она перестала работать smile

А подробней? Наверно стираю, но я ж новичок! smile

zoidberg

Дата 23.7.2006, 15:22 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 24
Регистрация: 18.7.2006

Репутация: нет
Всего: 0

А так это в 10й строке? Т.е innerHTML трет <input> и IE ругается? В опере и ff работает... я и подумать не мог. Но с этим ладно. А иначе можно страницу изменить без рефреша?

Avb

Дата 25.7.2006, 17:33 (ссылка)

(нет голосов)

Загрузка ...

Шустрый

Профиль
Группа: Участник
Сообщений: 115
Регистрация: 5.7.2006

Репутация: 4
Всего: 13

Вот то, что ты хотел получить:

Код


<script type="text/javascript">
    document.onkeyup = prnt;
    function prnt(ev) {
    var buffer = "";
        if(!ev)ev = window.event;
        var src =  ev.target || ev.srcElement;
        if(src == document.getElementById("in")) {
            buffer = document.getElementById("in").value;
            document.getElementById("magic").innerHTML = buffer;
        }
        document.getElementById("in").value = buffer;
    }
</script>
<form>
    <input type="text" id="in" /><br />
</form>
<span id="magic"></span>

Цитата(zoidberg @ 23.7.2006, 15:22

)

А иначе можно страницу изменить без рефреша?

Почитай про DOM.
Если нужен обмен данными с сервером, почитай про AJAX.

P.S. Google знает все

Это сообщение отредактировал(а) Avb - 25.7.2006, 17:36

zoidberg

Дата 26.7.2006, 04:11 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 24
Регистрация: 18.7.2006

Репутация: нет
Всего: 0

Цитата(Avb @ 25.7.2006, 17:33)

Вот то, что ты хотел получить...

Код


<span id="magic"></span>

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

skyboy

Дата 26.7.2006, 08:07 (ссылка)

(нет голосов)

Загрузка ...

неОпытный

Профиль
Группа: Модератор
Сообщений: 9820
Регистрация: 18.5.2006
Где: Днепропетровск

Репутация: 10
Всего: 260

Цитата(zoidberg @ 26.7.2006, 04:11

)

универсальный код с похожей функцией

какой именно? объясни на пальцах, сам ведь признал что твой код некорректно(не так, как ты хотел) в разных браузерах работает. касательно DOM - лучше найти хороший учебник/справочник. От себя могу порекомендовать только то, чем пользуюсь сам

Avb

Дата 26.7.2006, 13:59 (ссылка)

(нет голосов)

Загрузка ...

Шустрый

Профиль
Группа: Участник
Сообщений: 115
Регистрация: 5.7.2006

Репутация: 4
Всего: 13

innerHTML - не единственный способ динамически генерить страницу средствами js.

Почитай про DOM. Вот что первое попалось:
http://www.quirksmode.org/dom/intro.html
http://xhtml.ru/category/dom_intro/

А вообще, действительно, напиши, что ты хочешь. Понятней будет, что тебе советовать.

zoidberg

Дата 27.7.2006, 04:27 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 24
Регистрация: 18.7.2006

Репутация: нет
Всего: 0

Цитата(Avb @ 26.7.2006, 13:59)

А вообще, действительно, напиши, что ты хочешь. Понятней будет, что тебе советовать.

Хотел написать функцию, которая будет генерировать код сама. Т.е чтобы все формы с id magic генерировали на странице:

Код


<span id="magic">вводимые символы</span>

когда пользователь начинает набирать текст в инпуте. (если удастся без глюков реализовать это, то я хотел дальше плясать по схожей схеме, но уже динамически создавая таблицы...)
Знаю способы:
1) write(code); - не нравится т.к всю страницу переписывает.
2) innerHTML; - в firefox нет проблем, а в других браузерах с фокусом косяки.
Это все ради интереса. (т.е можно просто добавить <span id="magic"></span> и не париться, но захотелось иначе извратиться)
В идеале хочу:

Цитата

Верстальщик подключает js-код и назначает формам id="magic". Дальше в дело вступает javascript...

зы: с объектной моделью документов мне все понятно! smile

(мы её в коде и так используем). Лучше пните на конкретные ф-ии\методы и я почитаю про них на MDC. smile

Avb

Дата 27.7.2006, 10:32 (ссылка)

(нет голосов)

Загрузка ...

Шустрый

Профиль
Группа: Участник
Сообщений: 115
Регистрация: 5.7.2006

Репутация: 4
Всего: 13

http://developer.mozilla.org/en/docs/Dynam..._user_interface
http://developer.mozilla.org/en/docs/XUL_T...a_XUL_Interface

P.S. Стандарт W3C определяет id как уникальный идентификатор элемента.

Цитата(zoidberg @ 27.7.2006, 04:27

)

все формы с id magic

Может быть только одна форма с id "magic", иначе корректная работа скрипта не гарантируется.

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| JavaScript: Общие вопросы \| Следующая тема »