スクリプトからHTMLへの変数の受け渡し

Question

私は本当にここで愚かなものを紛失していなければならないと確信していますが、私のjavascript関数の値をHTMLフォームに渡すことはできません。

私は、次のコードを持っている：

<form class="form"> 
    <p>Potencia a Instalar (Watts) 
    <br /> 
    <span class="form"><input type="text" name="watts_to_install" value="" size="40" id="watts_to_install" required /> 
    </span> 
    </p> 
    <p>Panel a ser utilizado<br /> 
    <span class="form"> 
     <select name="panel" class="form" id="panel"> 
     <option id="Hanwha">Hanwha 250W</option> 
     <option id="Sharp">Sharp 250W</option> 
     </select> 
    </span> 
    </p> 
    <button onclick="Process1()">Nivel 1</button> 
    <span class="form"> 
    <p>Potencia Maxima de Panel</p> 
    <input type="text" id="max_power" value=""> 
    <br /> 
    <p>Cantidad a Instalar</p> 
    <input type="text" id="quantity" value=""> 
    </span> 
</form> 

<script type="text/javascript"> 
function Process1() 
{ 
    var power = document.getElementById('watts_to_install').value; 
    var panel = document.getElementById('panel').value; 
    switch(panel) 
    { 
     case 'Hanwha': 
      var power_panel = 250; 
      var panel_quantity = power/power_panel; 

      document.getElementById('max_power').value = power_panel; 
      document.getElementById('quantity').value= panel_quantity; 
      break; 
     case 'Sharp': 
      break; 
    } 
} 
</script> 

問題は、ページのロードと...何もhappendsないということです。私は自分のURLに情報を見るが、他には何もない。私は.valueの代わりに.innerHTMLを使って渡そうとしましたが、無駄でした。私は何かが本当に簡単に行方不明になる必要があることを知っているが、私はそれを見つけるように見えない。

Answer 1

あなたのオプションタグにvalueでidを交換する必要があります。

function Process1() { 
 
    var power = document.getElementById('watts_to_install').value; 
 
    var panel = document.getElementById('panel').value; 
 
    switch (panel) { 
 
    case 'Hanwha': 
 
     var power_panel = 250; 
 
     var panel_quantity = power/power_panel; 
 

 
     document.getElementById('max_power').value = power_panel; 
 
     document.getElementById('quantity').value = panel_quantity; 
 
     break; 
 
    case 'Sharp': 
 
     break; 
 
    } 
 
}

<form class="form"> 
 
    <p>Potencia a Instalar (Watts) 
 
    <br /> 
 
    <span class="form"><input type="text" name="watts_to_install" value="" size="40" id="watts_to_install" required /></span> 
 
    </p> 
 
    <p>Panel a ser utilizado 
 
    <br /> 
 
    <span class="form"><select name="panel" class="form" id="panel"> 
 
    <option value="Hanwha">Hanwha 250W</option> 
 
    <option value="Sharp">Sharp 250W</option> 
 
          </select></span> 
 
    </p> 
 
    <button onclick="Process1()">Nivel 1</button> 
 
    <span class="form"> 
 
          <p>Potencia Maxima de Panel</p> 
 
         <input type="text" id="max_power" value=""> 
 
         <br /> 
 
          <p>Cantidad a Instalar</p> 
 
         <input type="text" id="quantity" value=""> 
 
     </span> 
 
</form>