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

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

如何使用 jQuery 切換加號和減號圖標?

如何使用 jQuery 切換加號和減號圖標?

慕妹3242003 2023-08-10 15:17:39
我想切換guide-contentdiv 并將+圖標更改為-圖標,然后再次更改-為+圖標。為此,我有這個 jQuery 和 HTML:$(document).ready(function() {  $(".collapse").click(function() {    $(this).parents().next(".guide-content").toggle();    $(this).text("+");  }, function() {    $(this).text("-");    $(this).parents().next(".guide-content").toggle();  });});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><div class="guide-collapse">  <div class="guide-title">    <h2>アンティーク著物について <span class="collapse">+</span></h2>  </div>  <div class="guide-content">  </div></div><div class="guide-collapse">  <div class="guide-title">    <h2>アンティーク著物について <span class="collapse">+</span></h2>  </div>  <div class="guide-content">  </div></div>但它并沒有將圖標從 + 更改為 - 以及 - 更改為 +。
查看完整描述

3 回答

?
元芳怎么了

TA貢獻1798條經(jīng)驗 獲得超7個贊

我會使用 CSS 根據(jù)類來切換它。


這將允許您使用圖標來獲得更多細節(jié)和靈活性。


$('body').on('click', '.collapse', function(event) {

    $(this).toggleClass('isActive');

});


查看完整回答
反對 回復 2023-08-10
?
蕪湖不蕪

TA貢獻1796條經(jīng)驗 獲得超7個贊

如果您想要切換行為,請將 JS 代碼更改為以下內(nèi)容:


$(document).ready(function() {

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

        $(this).parents().next(".guide-content").toggle();

        if($(this).text() == "+"){

            $(this).text("-");

        }

        else {

          $(this).text("+");

        }

        

    });

});

每次單擊時,如果文本為“-”,則文本將更改為“+”;如果文本為“+”,則文本將更改為“-”。


查看完整回答
反對 回復 2023-08-10
?
桃花長相依

TA貢獻1860條經(jīng)驗 獲得超8個贊

我不完全確定您的意圖,但一種策略是僅使用兩個元素,其中一個元素隱藏并切換兩者:


$(document).ready(function() {

  $(".guide-collapse").click(function() {

    $(this).find('h2 span').toggle();

    $(this).find('.guide-content').slideToggle();

  });

});

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

<div class="guide-collapse">

  <div class="guide-title">

    <h2>アンティーク著物について <span class="collapse">+</span><span class="collapse" style="display: none;">-</span></h2>

  </div>

  <div class="guide-content" style="display: none;">Guide content here.</div>

</div>

<div class="guide-collapse">

  <div class="guide-title">

    <h2>アンティーク著物について <span class="collapse">+</span><span class="collapse" style="display: none;">-</span></h2>

  </div>

  <div class="guide-content" style="display: none;">Guide content here.</div>

</div>


查看完整回答
反對 回復 2023-08-10
  • 3 回答
  • 0 關注
  • 206 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網(wǎng)微信公眾號