需要根据选择框值

Question

我想根据选择框动态加载表单字段。我的选择框包含四个值。如果我选​​择3我的表单，显示三次动态字段名称。

＆＃13;

＆＃13;

<form method="POST">
  <table border=1> 
    <tr>
      <td>
       <div class="col-md-6">
          <div class="form-group">
	<label class="control-label col-md-4">First  Name:</label>
	<div class="col-md-8">
                    <input type="text" name="V1_Fname" >
           
               </div>
           </div>
       </div>
     </td>
     <td>
       <div class="col-md-6">
          <div class="form-group">
	<label class="control-label col-md-4">Last   Name:</label>
	<div class="col-md-8">
                     <input type="text" name="V1_Lname" ">
                 </div>
           </div>
       </div>  
      </td>
   </tr>
   <tr>
      <td>
       <div class="col-md-6">
          <div class="form-group">
	<label class="control-label col-md-4">Relation to Member:</label>
	<div class="col-md-8">
                    <select size="1" name="V1_Relation">
          	     <option selected="selected"></option>
      	     <option value="SP">Spouse</option>
      	     <option value="Son">Son</option>
       	     <option value="Daughter">Daughter</option>
      	     <option  value="F">Father</option>
     	     <option   value="M">Mother</option>
        	    <option value="MIL">Mother-in-   value="OTH">Other</option>
         	  </select>
           
               </div>
           </div>
       </div>
     </td>
     <td>
      
      </td>
   </tr>

</table>
</form>

＆＃13;

＆＃13;

＆＃13;

我需要这个表单加载三次如果我在选择框中选择3。   我试过jquery

＆＃13;

＆＃13;

   
$(document).ready(function() {
$('select#insured').change(function() {
var sel_value = $('select#insured').val();
if (sel_value == 0) {
$("#form_submit").empty(); // Resetting Form
$("#form1").css({
'display': 'none'
});
} else {

$("#form_submit").empty(); //Resetting Form
// Below Function Creates Input Fields Dynamically
create(sel_value);
// Appending Submit Button To Form
$("#form_submit").append($("<input/>", {
type: 'submit',
value: 'Register'
}))
}
});
function create(sel_value) {
// alert(sel_value);
for (var i = 1; i <= sel_value; i++) {
$("div#form1").slideDown('slow');
$("div#form1").append($("#form_submit").append($("<div/>", {
id: 'head'
}).append($("<h3/>").text("Visitor" + i)), $("<input/>", {
type: 'text',
placeholder: 'Name' + i,
name: 'firstName_' + i
}), $("<br/>"), $("<input/>", {
type: 'text',
placeholder: 'Last Name' + i,
name: 'lastName_' + i
}), $("<br/>"), $("<input/>", {
placeholder: 'Age' + i,
type: 'text',
name: 'Age_' + i
}), $("<br/>"), $("<hr/>"), $("<br/>")))
}
}
});
</script>

＆＃13;

  <link href='http://fonts.googleapis.com/css?family=Droid+Serif' rel='stylesheet' type='text/css'>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
 <select class="form-control" name="insured" id="insured">
							  <option value="1">1</option>
							  <option value="2">2</option>
							  <option value="3">3</option>
							  <option value="4">4</option>
							 </select>

<div id="form1">
				 <div id="form_submit">
				 </div>
				</div>

＆＃13;

＆＃13;

＆＃13;