简单数学计算表单脚本上的未捕获的ReferenceError

时间:2017-11-19 10:47:19

标签: javascript html

这个简单的数学脚本用于计算BMI的任何帮助,在本地浏览器上可以正常使用,在线浏览器可以在线使用,但不能在线使用chrome或边缘浏览器,但在Chrome移动浏览器上工作正常!检查元素显示'未捕获的ReferenceError:在HTML InputElement.onclick'中未定义computeform。

<script type="text/javascript" language="javascript">
<!-- hide this script tag's contents from old browsers

function ClearForm(form){

    form.weight.value = "";
    form.height.value = "";
    form.bmi.value = "";
    form.my_comment.value = "";
	form.my_comment2.value = "";

}

function bmi(weight, height) {

          bmindx=weight/eval(height*height);
          return bmindx;
}

function checkform(form) {

       if (form.weight.value==null||form.weight.value.length==0 || form.height.value==null||form.height.value.length==0){
            alert("\nPlease complete the form first");
            return false;
       }

       else if (parseFloat(form.height.value) <= 0||
                parseFloat(form.height.value) >=500||
                parseFloat(form.weight.value) <= 0||
                parseFloat(form.weight.value) >=500){
                alert("\nReally know what you're doing? \nPlease enter values again. \nWeight in kilos and \nheight in cm");
                ClearForm(form);
                return false;
       }
       return true;

}

function computeform(form) {

       if (checkform(form)) {

       yourbmi=Math.round(bmi(form.weight.value, form.height.value/100));
       form.bmi.value=yourbmi;

       if (yourbmi >40) {
          form.my_comment.value="You are grossly obese!";
		  form.my_comment2.value="Consult a physician imeadiatly!";
       }

       else if (yourbmi >35 && yourbmi <=40) {
          form.my_comment.value="You are obese!";
		  form.my_comment2.value="Consult a physician!";
       }

       else if (yourbmi >30 && yourbmi <=35) {
          form.my_comment.value="You are very over weight!";
		  form.my_comment2.value="Weight loss diet and exercise!";
       }

       else if (yourbmi >25 && yourbmi <=30) {
          form.my_comment.value="You are over weight!";
		  form.my_comment2.value="Healthy eating and exercise!";
       }

       else if (yourbmi >=18 && yourbmi <=25) {
          form.my_comment.value="You are the correct weight!";
		  form.my_comment2.value="Keep doing what your doing!";
       }

       else if (yourbmi >=16 && yourbmi <18) {
          form.my_comment.value="You are under weight!";
		  form.my_comment2.value="Eat more healthy food!";
       }

       else if (yourbmi >=14 && yourbmi <16) {
          form.my_comment.value="You are very under weight!";
		  form.my_comment2.value="Consult a physician!";
       }

       else if (yourbmi <14) {
          form.my_comment.value="You're grossly under weight!";
		  form.my_comment2.value="Consult a physician imeadiatly!";
       }

       }
       return;
}
 // -- done hiding from old browsers -->
</script>
<form name="BMI" method="post">
<table border="2">

<tr>
<td><div>Weight (kg)</div></td>	
</tr>
<tr>
<td><input type="text" name="weight"  size="10" onFocus="this.form.weight.value=''"></td>	
</tr>

<tr>
<td><div>Height (cm)</div></td>	
</tr>
<tr>
<td><input type="text" name="height"  size="10" onFocus="this.form.height.value=''"></td>	
</tr>

<tr>
<td><div>Your BMI</div></td>	
</tr>
<tr>
<td><input type="text" name="bmi" size="10" disabled></td>	
</tr>

<tr>
<td><div>BMI Information</div></td>	
</tr>
<tr>
<td><input type="text" name="my_comment" size="35" disabled></td>		
</tr>

<tr>
<td><div>Recommendation</div></td>	
</tr>
<tr>
<td><input type="text" name="my_comment2" size="35" disabled></td>		
</tr>
</table>

<br>
<input type="button" value="Check BMI" onClick="computeform(this.form)">
<input type="reset"  value="Reset" onClick="ClearForm(this.form)">
</form>

2 个答案:

答案 0 :(得分:0)

在文件开头添加初始javascript注释:

// <!-- hide this script tag's contents from old browsers

此外,从http://fitness-factory.uk/classes.html我可以看到脚本被定义为

<script type="text/rocketscript" language="javascript" data-rocketoptimized="true">

这意味着该脚本正在通过CloudFare脚本优化方法处理,该方法将在加载DOM后异步加载脚本。

尝试添加data-cfasync="false"以阻止它。

<script data-cfasync="false">

注意: data-cfasync="false"必须在src属性之前添加,即使这不适用于您的案例,因为您使用的是内联脚本。

答案 1 :(得分:0)

脚本运行正常。但是,会导致错误,因为您将javascript脚本标记和内容放在代码段的javascript部分中。您不应该在javascript部分中放置脚本标记,因为脚本标记是html元素。

因此,在显示代码段时,您应该删除javascript标记,并将javascript代码放在javascript部分中,或者您应该将javascript保留在html脚本标记中并将其全部放在html部分中。我已经在下面提供了最后一个解决方案的代码片段。

此外,如另一个答案中所述,在脚本标记中放置html格式的注释是不好的做法。这不会导致错误,但可能会导致其他问题。有关此内容的更多信息,请访问: Are HTML comments inside script tags a best practice?

我没有更正脚本标记中的html注释,以证明它与您获得的错误无关。但是,我建议您调整该评论的开头,就像这样的html评论的结尾一样:

<script type="text/javascript" language="javascript">
// <!-- hide this script tag's contents from old browsers

或者更好地完全删除评论,因为尝试注释脚本标记的内容是不好的做法。

以下示例显示了将所有代码放入html部分时会发生什么情况,这不会产生任何错误:

<form name="BMI" method="post">
<table border="2">

<tr>
<td><div>Weight (kg)</div></td>	
</tr>
<tr>
<td><input type="text" name="weight"  size="10" onFocus="this.form.weight.value=''"></td>	
</tr>

<tr>
<td><div>Height (cm)</div></td>	
</tr>
<tr>
<td><input type="text" name="height"  size="10" onFocus="this.form.height.value=''"></td>	
</tr>

<tr>
<td><div>Your BMI</div></td>	
</tr>
<tr>
<td><input type="text" name="bmi" size="10" disabled></td>	
</tr>

<tr>
<td><div>BMI Information</div></td>	
</tr>
<tr>
<td><input type="text" name="my_comment" size="35" disabled></td>		
</tr>

<tr>
<td><div>Recommendation</div></td>	
</tr>
<tr>
<td><input type="text" name="my_comment2" size="35" disabled></td>		
</tr>
</table>

<br>
<input type="button" value="Check BMI" onClick="computeform(this.form)">
<input type="reset"  value="Reset" onClick="ClearForm(this.form)">
</form>

<script type="text/javascript" language="javascript">
<!-- hide this script tag's contents from old browsers

function ClearForm(form){

    form.weight.value = "";
    form.height.value = "";
    form.bmi.value = "";
    form.my_comment.value = "";
	form.my_comment2.value = "";

}

function bmi(weight, height) {

          bmindx=weight/eval(height*height);
          return bmindx;
}

function checkform(form) {

       if (form.weight.value==null||form.weight.value.length==0 || form.height.value==null||form.height.value.length==0){
            alert("\nPlease complete the form first");
            return false;
       }

       else if (parseFloat(form.height.value) <= 0||
                parseFloat(form.height.value) >=500||
                parseFloat(form.weight.value) <= 0||
                parseFloat(form.weight.value) >=500){
                alert("\nReally know what you're doing? \nPlease enter values again. \nWeight in kilos and \nheight in cm");
                ClearForm(form);
                return false;
       }
       return true;

}

function computeform(form) {

       if (checkform(form)) {

       yourbmi=Math.round(bmi(form.weight.value, form.height.value/100));
       form.bmi.value=yourbmi;

       if (yourbmi >40) {
          form.my_comment.value="You are grossly obese!";
		  form.my_comment2.value="Consult a physician imeadiatly!";
       }

       else if (yourbmi >35 && yourbmi <=40) {
          form.my_comment.value="You are obese!";
		  form.my_comment2.value="Consult a physician!";
       }

       else if (yourbmi >30 && yourbmi <=35) {
          form.my_comment.value="You are very over weight!";
		  form.my_comment2.value="Weight loss diet and exercise!";
       }

       else if (yourbmi >25 && yourbmi <=30) {
          form.my_comment.value="You are over weight!";
		  form.my_comment2.value="Healthy eating and exercise!";
       }

       else if (yourbmi >=18 && yourbmi <=25) {
          form.my_comment.value="You are the correct weight!";
		  form.my_comment2.value="Keep doing what your doing!";
       }

       else if (yourbmi >=16 && yourbmi <18) {
          form.my_comment.value="You are under weight!";
		  form.my_comment2.value="Eat more healthy food!";
       }

       else if (yourbmi >=14 && yourbmi <16) {
          form.my_comment.value="You are very under weight!";
		  form.my_comment2.value="Consult a physician!";
       }

       else if (yourbmi <14) {
          form.my_comment.value="You're grossly under weight!";
		  form.my_comment2.value="Consult a physician imeadiatly!";
       }

       }
       return;
}
 // -- done hiding from old browsers -->
</script>