Ajouter plus de champs de texte de façon dynamique dans la nouvelle ligne (html)

J'ai utilisé le code de http://viralpatel.net/blogs/dynamic-add-textbox-input-button-radio-element-html-javascript/ html-javascript/.mon code est: est-ce

<HTML>
<HEAD>
<TITLE>Dynamically add Textbox, Radio, Button in html Form using JavaScript</TITLE>
<SCRIPT language="javascript">
function add() {

    for (i=1; i<=5; i++)
      {
        //Create an input type dynamically.
        var element = document.createElement("input");
     
        //Assign different attributes to the element.
        element.setAttribute("type", i);
        element.setAttribute("name", i);
        element.setAttribute("value", i);
     
     
        var foo = document.getElementById("fooBar");
     
        //Append the element in page (in span).
        foo.appendChild(element);
      }

 
}
</SCRIPT>
</HEAD>
<BODY>
<FORM>
<H2>Dynamically add element in form.</H2>
Select the element and hit Add to add it in form.
<BR/>
<INPUT type="button" value="Add" onclick="add()"/>
     
<span id="fooBar">&nbsp;</span>
     
</FORM>
</BODY>
</HTML>

Que le code fonctionne. Mais au lieu d'ajouter à l'horizontale, je veux que chaque nouveau champ de texte ajouté dans une nouvelle ligne. J'ai essayé d'utiliser </script><br/><script>, <html><br/></html>, document.write("\n"), et document.write("\r\n") dans la fonction loop, mais il ne marche pas comme ce que je veux. Que dois-je faire?

InformationsquelleAutor user1397595 | 2012-09-01

Pourquoi ne pas le faire?

var br = document.createElement("br");
foo.appendChild(br);

InformationsquelleAutor McGarnagle

Vous pouvez changer le style d'affichage des entrées.

function add() {

    for (i=1; i<=5; i++)
      {
        //Create an input type dynamically.
        var element = document.createElement("input");

        //Assign different attributes to the element.
        element.setAttribute("type", i);
        element.setAttribute("name", i);
        element.setAttribute("value", i);
        element.style.display = "block";

        var foo = document.getElementById("fooBar");

        //Append the element in page (in span).
        foo.appendChild(element);
      }
}

Bonne Chance!
Je vous recommande de commencer à l'aide de jQuery pour le javascript de votre tâches.

InformationsquelleAutor nicowernli

Vous pouvez essayer d'ajouter une nouvelle br élément après élément d'entrée.

  for (i=1; i<=5; i++)
  {
    //Create an input type dynamically.
    var element = document.createElement("input");

    //Assign different attributes to the element.
    element.setAttribute("type", i);
    element.setAttribute("name", i);
    element.setAttribute("value", i);

    var brElement = document.createElement("br");

    var foo = document.getElementById("fooBar");

    //Append the element in page (in span).
    foo.appendChild(element);
    foo.appendChild(brElement );
  }

InformationsquelleAutor Yograj Gupta

0

Vous pouvez simplement ajouter ceci dans votre css
```
input{display:block;}
```
InformationsquelleAutor Hazem Salama

Vous devez vous connecter pour publier un commentaire.