Question

我的javascript代码在jsfiddle中运行，但它在我的浏览器上不起作用。任何人都可以帮助我。提前致谢。这是我的html文件

<!DOCTYPE html>
 <head>
<title> BMI Calculator </title>
<meta charset= "UTF-8">
<link rel="stylesheet" href="stylev1.cs">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="jsv1.js" type="text/javascript">   </script>
</head>
<body>
<div>
Height (cm):
<input type="range" id="height" onchange="this.setAttribute('value',this.value);" min="100" max="250" step="0.1" value="0" />

<br>
Weight (kg):
<input type="range" id="weight" onchange="this.setAttribute('value',this.value);" min="0" max="200" step="0.1" value="0" />

<br>
Your BMI : 
<div id="displaybmi" value="" >   </div>

</div>

</body>

Javascript文件：

<script>
jQuery( document ).ready(function( ($("#height")||("#weight")).change(function(e) {    
                    var height, weight;
                    height = parseFloat($('#height').val());
                    height = height/100;
                    weight = parseFloat($('#weight').val()); 

                    $('#displaybmi').html(calbmi(weight,height)); 

                  function calbmi(){

                    var bmi = weight/(height*height);
                    return bmi;

                }   


        })));

http://jsfiddle.net/wm81/935fnmyx/9/

Answer 1

你的javascript / jQuery有很多错误。

您需要阅读：

回调 - 您已经将一些排序或参数传递给jQuery的ready回调。
jQuery selectors - 您没有使用#weight的实际jQuery选择器;它缺少美元符号，你可以在一个选择器中选择它们中的任何一个 - 就像CSS一样。
变量scope和函数参数 - 您已将参数传递给calbmi函数，但签名中没有实际参数。它只是使用了本地范围内同名的变量。

请参阅this fiddle并比较差异。

<强> JS

$("#height, #weight").on( 'change', function () {

    var height, weight;
    height = parseFloat($('#height').val());
    height = height / 100;
    weight = parseFloat($('#weight').val());
    var bmi = calbmi(weight, height);

    $('#displaybmi').html(bmi);

});


function calbmi(weight, height) {

    var bmi = weight / (height * height);
    return bmi;

}

<强> HTML

<div>
    Height (cm):
    <input type="range" id="height" min="100" max="250" step="0.1" value="0" />
    <br>Weight (kg):
    <input type="range" id="weight" min="0" max="200" step="0.1" value="0" />
    <br>Your BMI :
    <div id="displaybmi"></div>
</div>

代码在jsFiddle中工作，但不在我的浏览器中

1 个答案: