Problème lors de l'obtention de la variable Javascript à la valeur d'entrée cachée

Question

J'essaie de créer un système dans lequel vous pouvez faire glisser et redimensionner les divs (jquery ui), puis enregistrer les positions et les tailles dans un fichier css.

J'ai déjà obtenu le système fonctionnant avec un div, mais maintenant que j'ai essayé de mettre à jour le système pour prendre en charge plusieurs divs, j'ai rencontré un problème.

La source: http://ezmundorf.110mb.com/problem.txt (C'est moche, mais je suis juste en train d'essayer comment ça marche). Lorsque je clique sur le div #update, la page devient vide et la source de la page est uniquement la balise de début du formulaire. La page essaie de faire quelque chose depuis que Firefox affiche le graphique de chargement.

Si je supprime la ligne qui écrit les champs de saisie masqués, je vois le bouton de sauvegarde, mais il y a toujours quelque chose qui ne va pas avec le javascript puisque le navigateur continue à faire quelque chose.

Je suis désolé d'avoir posté une telle question «corrige ce code pour moi» ici, mais je ne sais pas comment l'expliquer sans code entier et je n'ai pas trouvé de réponse nulle part.

Answer 1

Vous ne pouvez pas utiliser document.write après le chargement de la page sans écraser toute la page, comme vous le voyez.

Vous devez utiliser .innerHTML sur certains conteneurs, par exemple:

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

ou utiliser des méthodes DOM:

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

body.appendChild('form'); 

Answer 2

Vous ne pouvez pas utiliser document.write une fois le chargement de la page terminé (par exemple, dans un gestionnaire d'événements, y compris $(document).ready). Au lieu de cela, vous pouvez utiliser la méthode jQuery .html(val) pour modifier le contenu d'un élément existant ou insérer de nouveaux éléments dans le DOM avec les autres méthodes jQuery manipulation.