2014-10-18 49 views
0

我有这个工作正常的基本“插入数字,输出答案”方面。但我需要验证到网站,所以只有某些事情的工作。我的网站在进行验证后,完全停止了工作,并且我没有完全理解为什么或者发生了什么。验证不起作用,现在我的网站也坏了

JS提琴:http://jsfiddle.net/ufs869wu/

HTML:

<form id="form1" name="form1" method="post" action=""> 
      <label for="txtAge">Age:</label> 
      <input type="text" class="txtInput" id="txtAge" value="0"/><p id="ageRes"></p> 
      <br/> 
      <label for="txtMass">Mass in Lbs:</label> 
      <input type="text" class="txtInput" id="txtMass" value="0"/> 
      <br/> 
      <label for="txtHinch">Height in Inches:</label> 
      <input type="text" class="txtInput" id="txtHinch" value="0"/> 
      <br/> 
      <input type="button" id="btnCalc" value="Calculate"/> 
      <p id="result2">Result</p> 
     </form> 
     <script src="http://code.jquery.com/jquery-latest.min.js"></script> 
     <script src="BMI.js"></script> 
</body> 

和JS

// JavaScript Document 

$(function() { 
    //Identify Variables 
    var txtMass, txtHinch, result; 
    var isValid = $('#form1').validate().form(); 
    // attach event listener to the toggle button's click event 



    $('#btnCalc').click(function() { 

     //Set validator 
      $.validator.setDefaults({ 
      errorElement: "span", 
      errorClass: "form_error", 
      errorPlacement: function(error,element){ 
       error.insertAfter(element) 
       } 
      }); 
      $.extend($.validator.messages,{ 
      required: "* Required field" 
      }); 
      //Set Validation perameters 
      $("#form1").validate({ 
      rules: { 
       txtAge: { 
        required: true, 
        range: [1, 120], 
        digits: true 
       }, 
       txtMass: { 
         require: true, 
         digits: true 
       }, 
       txtHinch: { 
        requre: true, 
        digits: true 
       } 
      } 
      }); 

     if (isValid) { 

      //Set Age range for form accuracy 
      if (txtAge < 16 || txtAage > 80){ 
      //Output 
      $('#ageRes').html('Results may not be accurate at your age') 
      } else { (txtAge >= 16 || txtAge <= 80) 
      $('#ageRes').html('Results should be accurate considering your age') 




      //Equation for BMI 
      result = ($('#txtMass').val()/($('#txtHinch').val() * $('#txtHinch').val())) * 703;} 

      //If - Else statement from output of BMI equation 

      if (result < 16){ 
      $('#result2').html('Result: '+result.toFixed(1) + ' you are Severely underweight') 
      } else if (result <=18){ 
      $('#result2').html('Result: '+result.toFixed(1) + ' you are underweight') 
      } else if (result <=24){ 
      $('#result2').html('Result: '+result.toFixed(1) + ' you are healthy') 
      } else if (result <= 30){ 
      $('#result2').html('Result: '+result.toFixed(1) + ' you are seriously overweight') 
      } else if (result <=35){ 
      $('#result2').html('Result: '+result.toFixed(1) + ' you are obese') 
      } else if (result <=40){ 
      $('#result2').html('Result: '+result.toFixed(1) + ' you are seriously obese') 
      } 

      } 


    }); 


}); 

感谢任何及所有的帮助!

回答

1

您在jquery加载之前调用'$',并得到'$'是未定义的错误。 尝试将此行上移到您的html的头部分。

<script src="http://code.jquery.com/jquery-latest.min.js"></script> 

另外,你是否包括jQuery验证插件的某个地方?我不认为它被包含在任何地方。