Question

我想建立一个网页，如果切尔西的进球数比阿森纳高，切尔西的得分会增加1，反之亦然。它不起作用，我不知道为什么 - 然后我几天前才开始学习JS / JQ。

代码有什么问题？另请注意，控制台中没有记录任何内容。：（

$(document).ready(function() {
    $("#play").click(function(){
            var chelsea = parseInt($('#chelsea-goals').val());
            var arsenal = parseInt($('#arsenal-goals').val());
        if (chelsea > arsenal) {
            parseInt($('#score-chelsea').val())++;
            console.log('Chelsea > Arsenal');
        }
        else if (arsenal > chelsea) {
            parseInt($('#score-arsenal').val())++;
            console.log('Arsenal > Chelsea');
        }
        else {
            console.log('Scores were equal');
        }       
   });
});

同时原谅格式化 - 在我的代码中它是正确的 - 在这里看起来不太好。

更新

<div class="scores" id="score-chelsea">0</div>
<div class="scores" id="score-arsenal">0</div>
<div class="goals" id="chelsea-goals">{{chelsea.goals}}</div>
<div class="goals" id="arsenal-goals">{{arsenal.goals}}</div>
<button id ="play"></button>

Answer 1

您无法增加parseInt()功能。将这些行更改为

$('#score-chelsea').val( parseInt( $('#score-chelsea').val() ) + 1 );

...与#score-arsenal相同。

演示：http://jsfiddle.net/2SVpE/

Answer 2

以下行是造成问题的原因 -

parseInt($('#score-chelsea').val())++;

你根本无法这样做...函数parseInt返回值。它不包含对从中提取值的元素的引用。你需要先把这个值放在一个变量中......

你会想要做这样的事情

var increasedGoals = parseInt($('#score-chelsea').val());
increasesGoals++;

parseInt(...)++的其他外观也是如此。

另一件值得一提的是选择器缓存。您正在使用选择器
<{1}}和$('#score-chelsea')不止一次，所以为什么不让它们进行缓存！

$('#score-arsenal')

Answer 3

1）div的内容不等同于javascript中的变量，因此您无法获取其内容并像上面那样调用++。您必须获取内容（将以字符串形式获取）将其转换为数字（parseInt部分），然后对其进行数学运算，然后使用新值设置div的内容（将自动转换为回到字符串，这就是你不必做那部分的原因。）

2）使用.text（）而不是.val（），。val（）用于表单字段的东西，不是div的内容（.html（）也可以工作，它获取整个HTML内容，而不仅仅是文本，在这种情况下只是文本是整个HTML内容......所以他们将采取相同的行动。）

var ch_goals = parseInt($('#score-chelsea').text());
ch_goals++;
$('#score-chelsea').text(ch_goals);

这更好地概述了这个过程，尽管有更短的编写方式，例如：

$('#score-chelsea').text( parseInt($('#score-chelsea').text())+1 );

比较Div值

3 个答案: