0

我想将文本框添加到我的 div 中。文本框的数量由选择列表给出。

<DOCTYPE html>

<html>    
 <head>
    <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
    <script type="text/javascript"></script>

 </head>

 <body>     
  <div id = "text">
    Choose No.of TextBoxes:
    <select id = "options">
       <option value="0">0</option>
       <option value="1">1</option>
       <option value="2">2</option>
       <option value="3">3</option>
       <option value="4">4</option>
    </select>
    <br/>
  </div>
 </body>
4

5 回答 5

3

这是小提琴

$('select#options').change(function () {
    $('div#text input').remove();
    var val = $(this).val();
    for (var x = 0; x < val; x++) {
        var createInputTextBox = '<input type="textbox" />';
        $('div#text').append(createInputTextBox);
    }
});
于 2013-06-08T08:35:32.787 回答
1

试试这个

$(document).ready(function()
{
    $("#options").change(function()
    {
        //Find if there is already a input box
        //if yes then remove it
        $("#text").find("input").remove();
        var count = $(this).val();

        for (var i = 1; i <= count; i++) {
            var ipBoxName ="myInput"+i;
            var ipBox = '&nbsp;&nbsp;<input type="textbox" name="'+ipBoxName+'" />';
            $('div#text').append(ipBox);

        }  
    });
});
于 2013-06-08T09:20:01.730 回答
0

You could try this:

$("select").change(function () {
  $(this).siblings("input").remove();
  for (i = 0; i < this.value; i++) {
    $("<input/>", {
        type: text,
        id: "textbox" + i
        //you add more attributes here if you want
    }).appendTo("#text");
  }
});

Here's a demo : http://jsfiddle.net/bPdPE/5/

Please look at .change() at jquery site.

于 2013-06-08T08:07:05.947 回答
0

Write this code in jQuery :-

 $('#options').change(function()
    {
        var no_of_textbox = $(this).val();   

        for(var i = 1 ;i<=no_of_textbox;i++)
        {
            $('#divtable').append('<input type="textbox" name="textbox"+i>');

        }


    });
于 2013-06-08T08:07:16.407 回答
0

调用选择框的 onchange 事件函数。像这样

<select id = "options" onchange="setbox(this.value)">

在 head 标签内使用它。

<script>
function setbox(val)
{ 
     for(var i = 1 ;i<=val;i++)
     {
        $('#divtable').append('<input type="textbox" name="textbox">');

    }
}

</script>
于 2013-06-08T08:12:58.487 回答