2016-07-25 83 views
0

我正尝试使用下拉列表和JavaScript创建一个简单的计算器,并且我无法获得结果。HTML简单下拉列表和结果

在JavaScript中,如果设置值为Office,则编写代码返回1411.21。否则它应该返回500. 但是,当我点击计算按钮时,它什么也不做。

这是我的HTML代码。

<html> 
<form method="post"> 
    <td>Setting : </td> 
     <select name="Setting" id="Setting"> 
       <option value="Office">Office</option> 
       <option value="HOPD">HOPD</option> 
     </select> 

<br/> 

    <td>Facility : </td> 
     <select name="Facility" id="Facility"> 
       <option value="100015">Mount Sinai, 123 Main Street, New York</option> 
       <option value="100016">NYU Medical, 25 North Broadway, New York</option> 
     </select> 




    <table border=1> 
     <tr> 
      <td>Product Size : </td> 
      <td><100sq cm</td> 
     </tr> 

     <tr> 
      <td>Number of DFU patients :</td> 
      <td>10</td> 
     </tr> 

     <tr> 
      <td>Patient co-pay % (based on wage adj.rate) :  </td> 
      <td>20%</td> 
     </tr> 
     <tr> 
      <td>Co-Pay percent actuallly collected : </td> 
      <td>75%</td> 
     </tr> 

     <tr> 
      <td></td> 
      <td> 
      <input type="button" id="button" value="calculate" onclick="settingValue();"> 
      </td> 
     </tr> 
     <tr> 
      <td>Result :</td> 
      <td> 
      <input type="text" id="result" placeholder="result"> 
      </td> 
     </tr> 

    </table> 
</br></br> 


    <table> 
     <tr> 
      <td>Medicare Payment Category</td> <td>High</td> <td>Low</td> 
     </tr> 
     <tr> 
      <td>Medicare Payment</td> <td id="medicarepayment" style="display: none"> 
      <td> 
     </tr> 
    </table> 
</form> 
</html> 

这里是java脚本代码。

<script type="text/javascript"> 
     var mydata = { 
      'Mount Sinai': ['100015','123 Main Street','New york'], 
      'NYU Medical' : ['100016,'25 North Broadway','New York] 
      } 
    var firstNum; 
    var secondNum; 
    var settingValue; 

    function settingValue(){ 
     settingValue=document.getElementById("Setting").value; 
     document.getElementById("result").value=medicarePaymentCal(settingValue); 

    } 


    function medicarePaymentCal(value1){ 
     var result; 
     if(value1=="Office"){ 
      return 1411.21; 
     } else { 
      return 500; 
     } 


    } 

    function init() { 
     var button=document.getElementById("button"); 
      button.onclick=medicarePaymentCal(); 
    } 

</script> 

回答

1

它看起来就像你正在试图获得document.getElementById("setting").value但实际ID为 “设置” 按

<select name="Setting"> 
      <option value="Office">Office</option> 
      <option value="HOPD">HOPD</option> 
    </select> 

尝试改变的getElementById到document.getElementById("Setting").value

编辑

好,我为你制作了一个JSFiddle: https://jsfiddle.net/dktoxtne/1/

让我知道如果这有效!我不记得我所有的改变,但我记得你需要将name="Setting"改为id="Setting"以及其他一些东西。

+2

此外,result元素声明为只读(尽管这是typo'd),并且元素永远不会关闭。 – Devsman

+0

我将其更改为document.getElementById(“Setting”)。value并且它仍然不起作用。 –

+0

正如@Devsman所示,Result Input存在错字,尝试更改 –

0
function settingValue(){ 
       //settingValue=document.getElementById("setting").value; 
       var e = document.getElementById("Setting"); 
       var settingValue = e.options[e.selectedIndex].value; 
       document.getElementById("result").value=medicarePaymentCal(settingValue); 

      }