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

選択ボックスの変更イベントで関数を呼び出します。このような

<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 に答える