第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全,請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問(wèn)題,去搜搜看,總會(huì)有你想問(wèn)的

如何一次一次改變div的顏色?關(guān)于在 jQuery 中選擇規(guī)則的問(wèn)題

如何一次一次改變div的顏色?關(guān)于在 jQuery 中選擇規(guī)則的問(wèn)題

偶然的你 2023-01-06 16:19:21
我是 jquery 的新手。我對(duì) jquery 中的選擇規(guī)則感到困惑。我創(chuàng)建了 3 個(gè)問(wèn)題并希望用戶(hù)單擊答案。顏色的 div 如果正確則變?yōu)樗{(lán)色,如果錯(cuò)誤則變?yōu)榧t色。但是,如果我只是點(diǎn)擊第一個(gè)問(wèn)題的正確答案,錯(cuò)誤答案的所有顏色也會(huì)改變。我應(yīng)該怎么辦?感謝觀看,不勝感激!$(".correct ").click(function() {  $(this).css('background-color', '#b8daff');  $(".wrong").css('background-color', '#f5c6cb');});.correct,.wrong {  padding: 5px;  text-align: center;  background-color: #b1dfbb;  border: solid 1px #c3c3c3;  cursor: pointer;}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><p>QUESTION</p><div class="question">  <div class="d-flex inline">    <div class="w-50 correct">A. Correcrt Answer</div>    <div class="w-50 wrong">B. Wrong answer </div>  </div></div><p>QUESTION</p><div class="question">  <div class="d-flex inline">    <div class="w-50 correct">A. Correcrt Answer</div>    <div class="w-50 wrong">B. Wrong answer </div>  </div></div><p>QUESTION</p><div class="question">  <div class="d-flex inline">    <div class="w-50 correct">A. Correcrt Answer</div>    <div class="w-50 wrong">B. Wrong answer </div>  </div></div>演示圖片
查看完整描述

3 回答

?
哆啦的時(shí)光機(jī)

TA貢獻(xiàn)1779條經(jīng)驗(yàn) 獲得超6個(gè)贊

做這個(gè) :


$(".correct ").click(function() {

  $(this).css('background-color', '#b8daff');

  $(this).next().css('background-color', '#f5c6cb');

});


查看完整回答
反對(duì) 回復(fù) 2023-01-06
?
智慧大石

TA貢獻(xiàn)1946條經(jīng)驗(yàn) 獲得超3個(gè)贊

這行代碼正在選擇所有 wrong答案:


$(".wrong").css('background-color', '#f5c6cb');

您需要找到與問(wèn)題相關(guān)的錯(cuò)誤答案(而不僅僅是正確答案旁邊的答案)。您可以通過(guò)使用$(this).parent()to get the question 來(lái)做到這一點(diǎn),然后find(.wrong)會(huì)發(fā)現(xiàn)它的孩子有“錯(cuò)誤”的課程。


$(this).parent().find(".wrong").css('background-color', '#f5c6cb');

工作片段(已更新以顯示它適用于不同的訂單和多個(gè)選項(xiàng)):


$(".correct ").click(function() {

  $(this).css('background-color', '#b8daff');

  $(this).parent().find(".wrong").css('background-color', '#f5c6cb');

});

.correct,

.wrong {

  padding: 5px;

  text-align: center;

  background-color: #b1dfbb;

  border: solid 1px #c3c3c3;

  cursor: pointer;

}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>


<p>QUESTION</p>

<div class="question">

  <div class="d-flex inline">

    <div class="w-50 correct">A. Correcrt Answer</div>

    <div class="w-50 wrong">B. Wrong answer </div>

  </div>

</div>

<p>QUESTION</p>

<div class="question">

  <div class="d-flex inline">

    <div class="w-50 wrong">A. Wrong answer </div>

    <div class="w-50 correct">B. Correcrt Answer</div>

  </div>

</div>

<p>QUESTION</p>

<div class="question">

  <div class="d-flex inline">

    <div class="w-50 wrong">A. Wrong answer </div>

    <div class="w-50 wrong">B. Wrong answer </div>

    <div class="w-50 correct">C. Correcrt Answer</div>

    <div class="w-50 wrong">D. Wrong answer </div>

  </div>

</div>

更新:( 正如卡斯滕在下面的評(píng)論中所問(wèn)的那樣)

大概正確的答案并不總是第一個(gè)答案(那不會(huì)很有效?。?- 如果問(wèn)題的答案超過(guò) 2 個(gè),甚至是下一個(gè)答案。

我建議這種方法而不是僅僅使用這種方法的原因next()是因?yàn)樗鼤?huì)找到錯(cuò)誤的答案,無(wú)論它在哪里或有多少其他問(wèn)題的答案(例如,如果你有 2 或 3 個(gè)錯(cuò)誤答案它仍然有效)


查看完整回答
反對(duì) 回復(fù) 2023-01-06
?
蕭十郎

TA貢獻(xiàn)1815條經(jīng)驗(yàn) 獲得超13個(gè)贊

這應(yīng)該適合你:


$(".correct").click(() => {

  $(this).css('background-color', '#b8daff');

  $(this).next().css('background-color', '#f5c6cb');

});


查看完整回答
反對(duì) 回復(fù) 2023-01-06
  • 3 回答
  • 0 關(guān)注
  • 171 瀏覽
慕課專(zhuān)欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購(gòu)課補(bǔ)貼
聯(lián)系客服咨詢(xún)優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)