javascript - 简单数学计算表单脚本中未捕获的 ReferenceError

标签 javascript html

任何帮助都感谢这个用于计算 BMI 的简单数学脚本，scrip 在本地浏览器上运行良好，在 internet explorer 上在线运行良好，但不能在 chrome 或 edge 浏览器上在线运行，但在 chrome 移动浏览器上运行良好!检查元素显示“Uncaught ReferenceError: computeform is not defined at HTML InputElement.onclick”。

<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>

最佳答案

脚本运行良好。但是，会导致错误，因为您将 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>

关于javascript - 简单数学计算表单脚本中未捕获的 ReferenceError，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/47375970/

上一篇：javascript - SoundCloud SC.Widget.Events.FINISH 不再触发 HTML5 小部件

下一篇：html - TYPO3 从 v4 升级到 v7 后的打字规则问题

相关文章：

javascript - 下划线模板 : "<string" not displayed, 但 "< string"是

javascript - 如何为动态添加的元素初始化 JQuery 插件

css - 根据图像方向更改 div 大小

html - 如何在 Bootstrap 中以相同的内联形式更改输入框的大小

html - CSS:删除行中的最后一个元素

javascript - 从数组 JSON 输入返回所有字段的 JSON 路径？

javascript - 从右到左的幻灯片

php - 用于检测 AIM 状态的 javascript 或 PHP 选项

javascript - 使用隐藏链接 url 的 __doPostBack 进行抓取

javascript - 如何在打印时隐藏打印按钮？

©2024 IT工具网  联系我们