Проблема получения переменной JavaScript для скрытого ввода значения

Question

Я пытаюсь создать систему, в которой вы можете перетаскивать и изменять размер элементов div (jquery ui), а затем сохранять позиции и размеры в файле CSS.

Я уже получил систему, работающую с одним div, но теперь, когда я попытался обновить систему для поддержки нескольких div, я столкнулся с проблемой.

Источник: http://ezmundorf.110mb.com/problem.txt ( Это уродливо, но я просто пытаюсь понять, как все работает).

Когда я щелкаю по элементу #update div, страница становится пустой, а источником для страницы является только начальный тег формы. Страница пытается что-то сделать, так как Firefox отображает загрузочную графику.

Если я удаляю строку, которая записывает скрытые поля ввода, я вижу кнопку сохранения, но все же что-то не так с javascript, так как браузер просто продолжает что-то делать.

Прошу прощения за публикацию такого " исправления этого кода для меня " вопрос здесь, но я не знаю, как объяснить это без всего кода, и я нигде не мог найти ответ.

Answer 1

Вы не можете использовать document.write после завершения загрузки страницы без перезаписи всей страницы, как вы видите.

Вы должны использовать .innerHTML в некотором контейнере, например:

$('myDiv').innerHTML = '<form>...</form>';

или используйте методы DOM:

var form = document.createElement('form');
var body = document.getElementsByTagName('body')[0];

body.appendChild('form');

Answer 2

Вы не можете использовать document.write после завершения загрузки страницы (например, в обработчике событий, включая $ (document) .ready ). Вместо этого вы можете использовать метод jQuery .html (val) изменить содержимое существующего элемента или вставить новые элементы в DOM с помощью другой манипуляции с jQuery методы.