Question

为什么这段代码不起作用？我猜我只是遗漏了一些非常明显的东西但是在搜索谷歌大约2个小时后我无法弄明白。

<html>
<head>
<title>Untitled Document</title>
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script>
var $total = $('#usertotal');
$('select').change(function () {
    var tot = 0;
    $('select > option:selected').each(function () {
        var selects = $(this).attr('value');
        if (selects) {
            tot += Number(selects);
        }
    });
    var final_result = tot / 350;
    $total.html(final_result.toFixed(2))
});
</script>
</head>

<body>
<form id="calc" name="calc">
    <fieldset id="water">1. Question One
        <br />
        <select name="val" id="val1" >
            <option value="0">Option 1</option>
            <option value="25">Option 2</option>
            <option value="50">Option 3</option>
            <option value="70">Option 4</option>
            <option value="90">Option 5</option>
        </select>
        <br />
        <br />2. Question Two
        <br />
        <select name="val" >
            <option value="40">Option 1</option>
            <option value="20">Option 2</option>
        </select>
        <br />
        <br />3. Question Three
        <br />
        <select name="val">
            <option value="40">Option 1</option>
            <option value="0">Option 2</option>
        </select>
    </fieldset>
</form>
<div>
<div id="usertotal">Total</div>
</div>
</body>
</html>

此处http://jsfiddle.net/EsC5G/9/也能正常工作，就在我用自己的文件测试它时。如果它是一个php文件，那会不会重要？

Answer 1

你需要在dom ready处理程序中添加你的脚本 - 在js小提琴中默认情况下脚本在window.onload处理程序上执行（左侧面板中的第二个下拉列表），这就是为什么它在那里工作的原因

//dom ready handler
jQuery(function () {
    var $total = $('#usertotal');
    $('select').change(function () {
        var tot = 0;
        $('select > option:selected').each(function () {
            var selects = $(this).attr('value');
            if (selects) {
                tot += Number(selects);
            }
        });
        var final_result = tot / 350;
        $total.html(final_result.toFixed(2))
    });
})

演示：Problem / Solution

总和形式选择值 - 我做错了什么

1 个答案: