如何用Javascript產生form表單中的欄位?

edited 十月 2013 in Javascript
大家好!

  想請問怎麼用Javascript或是DHTML動態產生表單欄位,例如我的form表單中已經有一個<input type="text" />了,我希望按一個按鈕後,網頁上會自動再產生一個<input typy="text" />所代表的欄位,或是動態產生其他的form表單中的東西,我試了老半天就是試不出來,用createElement('input')都沒用,書上的範例都是產生一般的HTML標籤,沒有說到產生form表單中的東西。

謝謝!

原始討論: http://twpug.net/x/modules/newbb/viewtopic.php?topic_id=4539

評論

  • edited 九月 2009
    其實表單欄位也只是一種HTML標記
    所以說,一樣可以直接刷區塊物件來達成效果,
    只是你要設法讓前端留住值,後端能接收,下面這小玩具參考看看吧
    <html>
    <body>
    <script type="text/javascript">
    var text_num=1;
    var id='text_';
    function add_text()
    {
        var text_id;
        var html='';
        for(i=0;i<text_num;i++)
        {
            text_id=id+i;
            html+='<input type="text" name="text[]" id="text_'+i+'" value="'+document.getElementById(text_id).value+'"/><br />';       
        }
        html+='<input type="text" name="text[]" id="text_'+text_num+'" />';
        text_num++;
        document.getElementById('text_zone').innerHTML=html;
    }
    </script>
    <input type="button" value="增加text" onclick="add_text()" />
    <br />
    <span id="text_zone">
    <input type="text" name="text[]" id="text_0" />
    </span>
    </body>
    </html>
    
  • edited 九月 2009
    剛才回想了一下, 以前也一直都是用 innerHTML 的方式來做動態產生的動作.
    Google 了一下 innerHTML, 找到了這篇文章, 可以給你多個參考.
    良葛格學習筆記 - Ajax Gossip: innerHTML 屬性
  • edited 九月 2009
    <html>
    <body>
    <script type="text/javascript">
    function add_text()
    {
            text = document.createElement('input')
            text.setAttribute('name', 'text[]')
            br   = document.createElement('br')
            document.getElementById('text_zone').appendChild(br)
            document.getElementById('text_zone').appendChild(text)
    }
    </script>
    <input type="button" value="增加text" onclick="add_text()" />
    <br />
    <span id="text_zone">
    <input type="text" name="text[]" id="text_0" />
    </span>
    </body>
    

    觀念很簡單啦.... 就容器上放物件而已..設設物件屬性..
    要移除也是一樣觀念呀..

    不好意思~抄了一下樓上的程式碼..

Sign In or Register to comment.