我正在尝试计算点差以确定胜利者。 我有一个函数,根据输入的分数计算总分数。 我写了一个函数来确定点差,然后给胜利者申请一个标签。但是出于某种原因,如果第二个玩家在第一个玩家获得积分后最终赢得胜利者,则仍然会向第一个玩家申请。
我做错了什么,是否有更好的方法来解决这个问题?
计算函数
function calculate() {
var arr = [];
var orr = [];
var input = "";
var row1 = 0;
var row2 = 0;
$("tbody tr").each(function() {
row_total = 0;
$(".score", this).each(function() {
row_total += Number($(this).val());
});
$(".total", this).val(row_total);
$(".total", this).each(function() {
arr[row1] = $(this).val();
row1 += 1;
});
$(".status", this).each(function() {
orr[row2] = $(this);
row2 += 1;
});
});
var spread = Math.abs(arr[0] - arr[1]);
if (spread >= 5) {
if (arr[0] > arr[1]) {
input = orr[0];
} else if (arr[1] > arr[0]) {
input = orr[1];
}
alert("arr0:" + arr[0] + '\n' +
"arr1:" + arr[1] + '\n' +
"orr0:" + orr[0].text() + '\n' +
"orr1:" + orr[1].text() + '\n' +
"input:" + $(input).text() + '\n');
var w3 = $(input).html("Winner");
var w4 = $(input).css('background-color', 'lightgreen');
var w5 = $(input).css('color', 'black');
}
}
HTML表格
<table id="main">
<tr>
<td class="r_color">
</td>
<td class="r_name">
Competitor
</td>
<td class="r_score">
Score
</td>
<td class="r_score">
Warnings
</td>
<td class="r_total">
Total
</td>
<td>
<input type="button" id="btn_Reset" value="Reset Points"/>
<input type="button" id="btn_Clear" value="Clear All"/>
</td>
</tr>
<tr>
<td class="r_color">
Red:
</td>
<td class="r_name">
<input type="text" class="name"/>
</td>
<td class="r_score">
<input class="score" type="number" step="1" min="-100" max="100" value="0" />
</td>
<td class="r_score">
<input class="warning" type="number" step="1" min="0" max="3" value="0" />
</td>
<td class="r_total">
<input class="total" type="text" value="0"/>
</td>
<td class="status">
red
</td>
</tr>
<tr>
<td class="r_color">
White:
</td>
<td class="r_name">
<input type="text" class="name"/>
</td>
<td class="r_score">
<input class="score" type="number" step="1" min="-100" max="100" value="0" />
</td>
<td class="r_score">
<input class="warning" type="number" step="1" min="0" max="3" value="0" />
</td>
<td class="r_total">
<input class="total" type="text" value="0"/>
</td>
<td class="status">
white
</td>
</tr>
</table>
答案 0 :(得分:1)
我试图“猜测”HTML部分并在第5,7和14行用.html()替换了.val(),因为我使用了我的分数,总数和状态(我不知道你是什么'重新使用)。
HTML部分:
<table border="1">
<tbody>
<tr>
<td class="score">10</td>
<td class="score">10</td>
<td class="score">5</td>
<td class="total"></td>
<td class="status"></td>
</tr>
<tr>
<td class="score">30</td>
<td class="score">4</td>
<td class="score">5</td>
<td class="total"></td>
<td class="status"></td>
</tr>
</tbody>
</table>
Javascript部分:
function calculate() {
$("tbody tr").each(function() {
row_total = 0;
$(".score", this).each(function() {
row_total += Number($(this).html());
});
$(".total", this).html(row_total);
});
var arr = [];
var orr = [];
var row = 0;
$("tbody tr").each(function() {
$(".total", this).each(function() {
arr[row] = $(this).html();
orr[row] = $(this);
row += 1;
});
});
var spread = Math.abs(arr[0] - arr[1]);
if (spread >= 5) {
alert(arr[0] + "|" + arr[1]);
if (arr[0] > arr[1]) {
var w3 = $(orr[0]).closest('tr').find('.status').html("Winner");
var w4 = $(orr[0]).closest('tr').find('.status').css('background-color', 'lightgreen');
var w5 = $(orr[0]).closest('tr').find('.status').css('color', 'black');
} else if (arr[1] > arr[0]) {
var w3 = $(orr[1]).closest('tr').find('.status').html("Winner");
var w4 = $(orr[1]).closest('tr').find('.status').css('background-color', 'lightgreen');
var w5 = $(orr[1]).closest('tr').find('.status').css('color', 'black');
}
}
}
更改其他内容,您的代码无效,请点击此处:http://jsfiddle.net/JgPvM/1/