Javascript验证计算器

时间:2015-03-29 22:50:48

标签: javascript

任何人都可以告诉我如何验证输入 就像我希望用户输入19到80岁之间的年龄我该怎么办? 对不起,我是javascript的新手我已阅读并尝试了很多关于我的代码的教程,但它无法正常工作

here is my html code

<FORM name="dci"   id="dci">

          <tr>
              <input class="forminputcontent"  placeholder="Age"    type="number" onkeyup=dcicheck(1)  name=age size="10" > 
              </tr>
              <br>



            <tr>
                 <td><input class="forminputcontent" type="number"  placeholder="Weight" onkeyup=dcicheck(2) name=weight size="20" ></td>
                <td><select class="cal_option" name=wkg>
                <option value=1 selected>Pnd</option>
                <option value=2.2046 >Kg</option>

                </select></td>
               </tr>
               <br>


             <tr>
                  <td><input class="forminputcontent"  placeholder="Height" type="number"  min="0" onkeyup=dcicheck(3) name=height size="20" ></td>
                   <td><select class="cal_option" name=hcm>
                        <option value=1>inch</option>
                        <option value=0.3937>cm</option> 
                         </select></td>
                   </tr>
                   <br>


                   <tr>
               <SELECT name=esel style="width:72%;border: solid 1px silver";>
               <option value=1.2>sedentary, desk job</option>
                               <option value=1.375>light exercise, 1-3 days per week</option>
                               <option value=1.55>moderate exercise, 3-5 days per week</option>
                               <option value=1.725>hard exercise, 6-7 days per week</option>
                               <option value=1.9>very hard exercise, physics job</option>
                </SELECT>       

              </tr>

            <br>
            <br>



            <tr>
            <td width=200 style="font-size:18px" align=right> Gender: </TD>
            <td width=10></TD>
            <td width=240>
            <input type="radio" value="male" checked name="sex"><font style="color:black;font-size:16px">&nbsp;&nbsp;male</font></input>
            &nbsp;&nbsp;&nbsp;
            <input type="radio" value="female" name="sex"><font style="color:black;font-size:16px">&nbsp;&nbsp;female</font></input>
            </TD>
            <td width=120>
            </td>
            </tr>
            <br>
            <br>

            <tr>
            <input ReadOnly class="forminputcontent" name=res placeholder="Daily Calories Needed"  style="width:50%;border: solid 1px silver;" size="20" > 
            </tr>



        </TBODY>

    </FORM>
    </font>


            <div class="modal-footer">
            <input style="font-size: 17px" onclick="caldci()" type="button" name="Calculate" value="Calculate"/>

and here is javascript 

function caldci()
{


     var age = document.dci.age.value;  //age in years
     var height = document.dci.height.value;
     var weight = document.dci.weight.value;
     var wkg = document.dci.wkg.value; //weight in pounds
     var hcm = document.dci.hcm.value;  //height in inches
     var esel = document.dci.esel.value; //activity levels
     var sex = document.dci.sex.value;  



     var ret="";     

     for( i = 0; i < document.dci.sex.length; i++ )
     {
        if( document.dci.sex[i].checked == true )
        sex = document.dci.sex[i].value;
     }


    //formulas
     if (age=="" || weight=="" || height=="")
     {return;}
     else
     {
         if (sex == "female")
         {

             ret = 655 + 4.35 * weight * wkg + 4.7 * height * hcm - 4.7 * age;
         }
         else if (sex == "male")
             ret = 66 + 6.23 * weight * wkg + 12.7 * height * hcm - 6.8 * age;

         ret = ret * esel;

         ret = ret.toFixed(2);

         document.dci.res.value=ret;
     }
}

function isNum(args)
{
    args = args.toString();

    if (args.length == 0)
    return false;

    for (var i = 0;  i<args.length;  i++)
    {
        if ((args.substring(i,i+1) < "0" || args.substring(i, i+1) > "9") && args.substring(i, i+1) != ".")
        {
            return false;
        }
    }

    return true;
}

function dcicheck(p)
{
     var age = document.dci.age.value;
     var height = document.dci.height.value;
     var weight = document.dci.weight.value;
     //alert(a);
    if (p == "1" && !isNum(age))
    {
          age = a.substring(0,a.length-1);
          document.dci.age.value = age;
          return;      
    }
    if (p == "2" && !isNum(weight))
    {
          weight = weight.substring(0,weight.length-1);
          document.dci.weight.value = weight;
          return;      
    }
    if (p == "3" && !isNum(height))
    {
          height = height.substring(0,height.length-1);
          document.dci.height.value = height;
          return;      
    }
}

1 个答案:

答案 0 :(得分:0)

请参阅这个非常简单的示例:http://jsfiddle.net/pcf2oehj/

HTML

<input type="number" id="age">
<button id="validate">validate</button>

的Javascript

document.getElementById('validate').onclick =
function () {
  var age =   document.getElementById('age').value;    
    if (age<19 || age>80) {
     alert("not in range");   
    }

}