twocoders.de
 

programme/javascript/elementhinzufuegen/formularelemente.html


1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

    <head>
        <meta http-equiv="content-type" content="text/html;charset=utf-8" />
        <meta name="generator" content="Adobe GoLive" />
        <title>Element hinzuf&uuml;gen</title>
        
        <script language="javascript" type="text/javascript">
        var index=0;
        function neuerinput(type,element)
        {
            index++;
            var form = document.getElementById("form");
            var newinput = document.createElement(element); //Ein neues Inputeingabefeld erstellen
            //Attribute type und name setzen
            newinput.setAttribute("type",type);
            newinput.setAttribute("name","input"+index);
            
            form.appendChild(document.createTextNode("Input"+index+" ("+type+"): ")); //Beschriftung für Input einfügen
            form.appendChild(newinput); //Den Input in die Form eintragen
            form.appendChild(document.createElement("br")); //Ein <br> Element hinzufügen
            form.appendChild(document.createTextNode("\r\n")); //carriage return einfügen
        }
        </script>
    </head>

    <body>
        <p>
            <select name="selectName" size="1" onchange="neuerinput(this.value,'input')">
                <option value="text">Textfeld</option>
                <option value="password">Passwortfeld</option>
                <option value="button">Button</option>
                <option value="submit">Submit</option>
                <option value="reset">Reset</option>
                <option value="file">Datei</option>
                <option value="checkbox">Checkbox</option>
                <option value="radio">Radiobutton</option>
            </select>
        </p>
        <form action="#" method="post" id="form">

        </form>
    </body>

</html>