1

我想创建一个网页，如果切尔西的进球数比阿森纳多，切尔西的得分就会增加 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>
4

3 回答 3

4

你不能增加一个parseInt()函数。将这些行更改为

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

...与#score-arsenal.

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

于 2012-12-30T18:42:34.830 回答
3

以下行是导致问题的原因 -

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

你根本不能那样做......函数parseInt返回值。它不包含对您从中提取值的元素的引用。您需要先将该值放入变量中...

你会想做这样的事情

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

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

这里值得一提的是选择器缓存。您不止一次地使用选择器，那么为什么不缓存它们呢
$('#score-chelsea')！$('#score-arsenal')

$("#play").on('click',function(){
  var chelsea = $('#chelsea-goals');
  var arsenal = $('#arsenal-goals');
  ...
  var chelseaGoals = chelseaElement.val();
  chelseaGoals++;
  chelsea.val(chelseaGoals);
  ...
});
于 2012-12-30T18:43:29.927 回答
0

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 );
于 2012-12-30T19:02:29.470 回答