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

為了賬號安全，請及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問題，去搜搜看，總會有你想問的

有沒有辦法讓代碼更短

有沒有辦法讓代碼更短

慕容708150 2023-05-19 16:25:37
我在我的網(wǎng)站上實(shí)現(xiàn)了一個(gè) JavaScript 代碼，代碼運(yùn)行以切換幻燈片，并且有 15 張這樣的幻燈片，所以對于每張我都實(shí)現(xiàn)了幻燈片切換代碼，但我想知道是否有任何更短的方法可以讓我寫代碼一次，它就會在所有幻燈片上實(shí)現(xiàn)。    $(".main1").click(function(){    $(".show1").slideToggle("slow");  });    $(".main2").click(function(){    $(".show2").slideToggle("slow");  });    $(".main3").click(function(){    $(".show3").slideToggle("slow");  });    $(".main4").click(function(){    $(".show4").slideToggle("slow");  });    $(".main5").click(function(){    $(".show5").slideToggle("slow");  });    $(".main6").click(function(){    $(".show6").slideToggle("slow");  });    $(".main7").click(function(){    $(".show7").slideToggle("slow");  });    $(".main8").click(function(){    $(".show8").slideToggle("slow");  });    $(".main9").click(function(){    $(".show9").slideToggle("slow");  });    $(".main10").click(function(){    $(".show10").slideToggle("slow");});    $(".main11").click(function(){    $(".show11").slideToggle("slow");  });    $(".main12").click(function(){    $(".show12").slideToggle("slow");  });    $(".main13").click(function(){    $(".show13").slideToggle("slow");  });    $(".main14").click(function(){    $(".show14").slideToggle("slow");  });    $(".main15").click(function(){    $(".show15").slideToggle("slow");  });
查看完整描述

4 回答

?
楊__羊羊

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

我相信這對你有用。


for (let i = 1; i <= 15; i++) {

  $(".main" + i).click(function(){

    $(".show" + i).slideToggle("slow");

  });

} 


查看完整回答
反對 回復(fù) 2023-05-19
?
qq_遁去的一_1

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

在每個(gè)元素上放置相同的類，然后使用data屬性來定位您想要的不同實(shí)例slideToggle()。使用此方法，相同的三行 JS 將適用于 HTML 中無限數(shù)量的相關(guān)元素。


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

  $(this.dataset.target).slideToggle("slow");

});

.show { display: none; }

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

<a href="#" class="main" data-target="#show-1">Show 1</a>

<a href="#" class="main" data-target="#show-2">Show 2</a>

<a href="#" class="main" data-target="#show-3">Show 3</a>


<div class="show" id="show-1">Lorem ipsum</div>

<div class="show" id="show-2">Dolor sit</div>

<div class="show" id="show-3">Amet consectetur</div>


查看完整回答
反對 回復(fù) 2023-05-19
?
收到一只叮咚

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

遍歷DOM解決方案

使用this關(guān)鍵字并遍歷 DOM

這意味著“通過”，用于根據(jù)與其他元素的關(guān)系“查找”（或選擇）HTML 元素

就是這樣。

例如：如果內(nèi)容是按鈕的下一個(gè)兄弟元素，請使用next()（2 行代碼）。

$('button.slider_trigger').click(function() {

? $(this).next().slideToggle("slow");

});

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

<div>

? <button class="slider_trigger">Toggle 1</button>

? <p class="content">

? ? This is the paragraph 1 to end all paragraphs.? You

? ? should feel <em>lucky</em> to have seen such a paragraph in

? ? your life.? Congratulations!

? </p>

</div>


<div>

? <button class="slider_trigger">Toggle 2</button>

? <p class="content">

? ? This is the paragraph 1 to end all paragraphs.? You

? ? should feel <em>lucky</em> to have seen such a paragraph in

? ? your life.? Congratulations!

? </p>

</div>

如此處其他答案所述，最好的方法是使用mainand showclasses 而不是main1,main2等main3。


如果由于某種原因你不能改進(jìn)你的 html 結(jié)構(gòu)，你可以使用 jquery 來regex定位元素：


$("[class^=main]").click(function(Event) {

? ? var id = this.className.match(/main(\d+)/)[1];

? ? $(".show" + id).slideToggle("slow");

});

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


<button class="main1">Toggle 1</button>

<p class="show1">

? This is the paragraph 1 to end all paragraphs.? You

? should feel <em>lucky</em> to have seen such a paragraph in

? your life.? Congratulations!

</p>


<button class="main2">Toggle 2</button>

<p class="show2">

? This is the paragraph 2 to end all paragraphs.? You

? should feel <em>lucky</em> to have seen such a paragraph in

? your life.? Congratulations!

</p>

如此處其他答案所述，最好的方法是使用mainand showclasses 而不是main1,main2等main3。


如果由于某種原因你不能改進(jìn)你的 html 結(jié)構(gòu)，你可以使用 jquery 來regex定位元素：


$("[class^=main]").click(function(Event) {

? ? var id = this.className.match(/main(\d+)/)[1];

? ? $(".show" + id).slideToggle("slow");

});

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


<button class="main1">Toggle 1</button>

<p class="show1">

? This is the paragraph 1 to end all paragraphs.? You

? should feel <em>lucky</em> to have seen such a paragraph in

? your life.? Congratulations!

</p>


<button class="main2">Toggle 2</button>

<p class="show2">

? This is the paragraph 2 to end all paragraphs.? You

? should feel <em>lucky</em> to have seen such a paragraph in

? your life.? Congratulations!

</p>


查看完整回答
反對 回復(fù) 2023-05-19
?
偶然的你

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

也許嘗試使用 for 循環(huán)：


for (let i=1; i<16; i++){

    $((".main"+i.toString())).click(function(){

        $((".show"+i.toString())).slideToggle("slow");

     });

}


查看完整回答
反對 回復(fù) 2023-05-19
  • 4 回答
  • 0 關(guān)注
  • 226 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

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

 幫助反饋 APP下載

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

 公眾號

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