JavaScriptでJavascriptのonchange関数が動作しない

Question

PHPを使用してフォームを生成するコードを記述しました。ドロップダウンメニュー（127行）から何かを選択して、javascript（57行目）を使用して変更したい：

"range"という値を選択した場合は、フォームに2つの入力を追加したいのですが、 行の隣に。

This is how I want it to look like

// Javascript 
$(function() { 
    $("#select1").on("change",function() { 
     var value = this.value; 
     document.getElementById('a').innerHTML = value; 
    }); 
}); 

// HTML 
<select onchange="select(this.value)" id="select1" name="type$i" size="1"> 
    <option value="max">Maximum the best</option> 
    <option value="min">Minimum the best</option> 
    <option value="range">Range</option> 
</select> 

Answer 1

私はよく理解している場合、これはアプローチである可能性があります。それが役に立てば幸い！

$(function() { 
 
      $("#select1").on("change",function() { 
 
      var value = $(this).val(); 
 
      if (value == "range") { 
 
       $("#select2, #select3").show(); 
 
      } else { 
 
       $("#select2 , #select3").hide(); 
 
      } 
 
      
 
      }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select id="select1" name="type1" size="1"> 
 
    <option value="max">Maximum the best</option> 
 
    <option value="min">Minimum the best</option> 
 
    <option value="range">Range</option> 
 
</select> 
 

 
<select id="select2" name="type2" size="1" style="display:none;"> 
 
    <option value="max">Maximum the best</option> 
 
    <option value="min">Minimum the best</option> 
 
    <option value="range">Range</option> 
 
</select> 
 
<select id="select3" name="type3" size="1" style="display:none;"> 
 
    <option value="max">Maximum the best</option> 
 
    <option value="min">Minimum the best</option> 
 
    <option value="range">Range</option> 
 
</select>

Answer 2

このような単純な例では、あなたを助けるかもしれません。完全なHTMLがなければ、より良い例を提供することはできません。

function select(value) { 
 
    if (value == "range") { 
 
    $('<input>').attr({ 
 
     type: 'text', 
 
     id: 'foo1', 
 
     name: 'bar1' 
 
    }).appendTo('form'); 
 
    $('<input>').attr({ 
 
     type: 'text', 
 
     id: 'foo2', 
 
     name: 'bar2' 
 
    }).appendTo('form'); 
 
    } 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form> 
 
    <select onchange="select(this.value)" id="select1" name="type$i" size="1"> 
 
    <option value="max">Maximum the best</option> 
 
    <option value="min">Minimum the best</option> 
 
    <option value="range">Range</option> 
 
</select> 
 
</form>