gpt4 book ai didi

javascript - javascript 条件问题

转载 作者:行者123 更新时间:2023-11-28 16:48:34 24 4
gpt4 key购买 nike

我正在从 Html 类中获取排名计数,我想根据排名计数显示结果

有 5 个问题有这 4 个选项

其 Html 如下所示

var $ = jQuery;
var rank = 0;
var i;
var x = $(".que").toArray();
var length = x.length+1;
for (i = 1; i < length; i++) {

var rank_count = ($('.que' + i).find(".selected_answer").attr("class").split(/\s+/));
//var rank = parseInt(rank) + parseInt(rank_count[1].replace('rank_',''));

if (i == 5 && rank_count[1] == 'rank_1') {
rank = parseInt(16);
//console.log(rank);
} else {
rank = parseInt(rank) + parseInt(rank_count[1].replace('rank_', ''));
//
console.log(rank);
}

}
// if rank between 0-4 then show this
if (rank >= parseInt(0) && rank <= parseInt(4)) {
$('.result').find(".blog1").css('display', 'flex');
}
// if rank between 5-8 then show this
if (rank >= parseInt(5) && rank <= parseInt(8)) {
$('.result').find(".blog2").css('display', 'flex');
}
// if rank between 9-12 then show this
if (rank >= parseInt(9) && rank <= parseInt(12)) {
$('.result').find(".blog3").css('display', 'flex');
}
// if rank between 13-16 then show this
if (rank >= parseInt(13) && rank <= parseInt(16)) {
$('.result').find(".blog4").css('display', 'flex');
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<p class="que1 que">question1</p>
<span class="answer rank_1">Simple Blog 1</span>
<span class="answer rank_2 selected_answer">Simple Blog 2</span>
<span class="answer rank_3">Simple Blog 3</span>
<span class="answer rank_4">Simple Blog 4</span>


<p class="que2 que">question2</p>
<span class="answer rank_1 selected_answer">Simple Blog 1</span>
<span class="answer rank_2">Simple Blog 2</span>
<span class="answer rank_3">Simple Blog 3</span>
<span class="answer rank_4">Simple Blog 4</span>

<p class="que3 que">question3</p>
<span class="answer rank_1">Simple Blog 1</span>
<span class="answer rank_2 selected_answer">Simple Blog 2</span>
<span class="answer rank_3">Simple Blog 3</span>
<span class="answer rank_4">Simple Blog 4</span>

<p class="que4 que">question4</p>
<span class="answer rank_1 selected_answer">Simple Blog 1</span>
<span class="answer rank_2">Simple Blog 2</span>
<span class="answer rank_3">Simple Blog 3</span>
<span class="answer rank_4">Simple Blog 4</span>

<p class="que5 que">question5</p>
<span class="answer rank_1 selected_answer">Simple Blog 1</span>
<span class="answer rank_2">Simple Blog 2</span>
<span class="answer rank_3">Simple Blog 3</span>
<span class="answer rank_4">Simple Blog 4</span>

在此,我设置了条件,如果 que5 选择了答案rank_1,则设置排名 16,否则根据所选答案设置排名计数。

但是当我按照

设置所选答案时
if (i == 5 && rank_count[1] == 'rank_1') 
{
rank = parseInt(16);
console.log(rank);
}else{
rank = parseInt(rank) + parseInt(rank_count[1].replace('rank_',''));
console.log(rank);
}

它没有显示正确的结果或显示 2 个结果 blog3 或 blog4

不知道为什么会这样

谁能帮我解决这个问题

最佳答案

需要在三个地方进行更改。
1. 定义长度变量为 var length = $("p[class^='que']").length;
2. HTML中

标签应该在所有span元素之后结束,只有这样$('.que' + i).find(".selected_answer")才能找到带.<的span strong>selected_answer 类别
3. for 循环内的条件应包含 <= 以便达到 5

//var $ = jQuery;
var rank = 0;
var length = $("p[class^='que']").length;

for (i = 1; i <= length; i++) {

var rank_count = ($('.que' + i).find(".selected_answer").attr("class").split(/\s+/));
//var rank = parseInt(rank) + parseInt(rank_count[1].replace('rank_',''));

if (i == 5 && rank_count[1] == 'rank_1') {
rank = parseInt(16);

//console.log(rank);
} else {
rank = parseInt(rank) + parseInt(rank_count[1].replace('rank_', ''));
//
console.log(rank);
}

}
alert(rank);
// if rank between 0-4 then show this
if (rank >= parseInt(0) && rank <= parseInt(4)) {
$('.result').find(".blog1").css('display', 'flex');
}
// if rank between 5-8 then show this
if (rank >= parseInt(5) && rank <= parseInt(8)) {
$('.result').find(".blog2").css('display', 'flex');
}
// if rank between 9-12 then show this
if (rank >= parseInt(9) && rank <= parseInt(12)) {
$('.result').find(".blog3").css('display', 'flex');
}
// if rank between 13-16 then show this
if (rank >= parseInt(13) && rank <= parseInt(16)) {
$('.result').find(".blog4").css('display', 'flex');
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<p class="que1">question1
<span class="answer rank_1">Simple Blog 1</span>
<span class="answer rank_2 selected_answer">Simple Blog 2</span>
<span class="answer rank_3">Simple Blog 3</span>
<span class="answer rank_4">Simple Blog 4</span>
</p>

<p class="que2">question2
<span class="answer rank_1 selected_answer">Simple Blog 1</span>
<span class="answer rank_2">Simple Blog 2</span>
<span class="answer rank_3">Simple Blog 3</span>
<span class="answer rank_4">Simple Blog 4</span>
</p>
<p class="que3">question3
<span class="answer rank_1">Simple Blog 1</span>
<span class="answer rank_2 selected_answer">Simple Blog 2</span>
<span class="answer rank_3">Simple Blog 3</span>
<span class="answer rank_4">Simple Blog 4</span>
</p>
<p class="que4">question4
<span class="answer rank_1 selected_answer">Simple Blog 1</span>
<span class="answer rank_2">Simple Blog 2</span>
<span class="answer rank_3">Simple Blog 3</span>
<span class="answer rank_4">Simple Blog 4</span>
</p>
<p class="que5">question5
<span class="answer rank_1 selected_answer">Simple Blog 1</span>
<span class="answer rank_2">Simple Blog 2</span>
<span class="answer rank_3">Simple Blog 3</span>
<span class="answer rank_4">Simple Blog 4</span>
</p>

关于javascript - javascript 条件问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60259792/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com