ERIC 發問時間: 電腦與網際網路程式設計 · 7 年前

JS展開及收起的語法

大家好,

下列的語法是一個可以做展開縮放的語法

利用DD DT的概念去實現文章的展開及收起

我的問題是因為我不大會程式,但想要修改下列語法

讓它在一開始的時候就是全部展開,或者單一展開

請問有人可以幫我解答嗎?謝謝

$(document).ready(function(){

// The published URL of your Google Docs spreadsheet as CSV:

var csvURL = 'https://spreadsheets.google.com/pub?key=%27+

'0Ahe1-YRnPKQ_dEI0STVPX05NVTJuNENhVlhKZklNUlE&hl=en&output=csv';

// The YQL address:

var yqlURL ="http://query.yahooapis.com/v1/public/yql?q=%22+

"select%20*%20from%20csv%20where%20url%3D'"+encodeURIComponent(csvURL)+

"'%20and%20columns%3D'question%2Canswer'&format=json&callback=?";

$.getJSON(yqlURL,function(msg){

var dl = $('<dl>');

// Looping through all the entries in the CSV file:

$.each(msg.query.results.row,function(){

// Sometimes the entries are surrounded by double quotes. This is why

// we strip them first with the replace method:

var answer = this.answer.replace(/""/g,'"').replace(/^"|"$/g,'');

var question = this.question.replace(/""/g,'"').replace(/^"|"$/g,'');

// Formatting the FAQ as a definition list: dt for the question

// and a dd for the answer.

dl.append('<dt><span class="icon"></span>'+question+'</dt><dd>'+answer+'</dd><dd>'+answer+'</dd>');

});

// Appending the definition list:

$('#faqSection').append(dl);

$('dt').live('click',function(){

var dd = $(this).next();

// If the title is clicked and the dd is not currently animated,

// start an animation with the slideToggle() method.

if(!dd.is(':animated')){

dd.slideToggle();

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

}

});

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

// To expand/collapse all of the FAQs simultaneously,

// just trigger the click event on the DTs

if($(this).hasClass('collapse')){

$('dt.opened').click();

}

else $('dt:not(.opened)').click();

$(this).toggleClass('expand collapse');

return false;

});

});

});

1 個解答

評分
  • 囧囧
    Lv 4
    7 年前
    最佳解答

    你好

    我給你簡單一點的

    <script type="text/javascript">

    var isShow = true;

    function change() {

    if(!isShow) {

    isShow = true;

    document.getElementById('d1').style.display='';

    document.getElementById('a1').innerText = "隱藏"; }

    else {

    isShow = false;

    document.getElementById('d1').style.display='none';

    document.getElementById('a1').innerText = "展開";

    }

    }

    </script>

    <div id="d1">測試</div><a id="a1" href="javascript:;" onClick="change()">隱藏</a>

    程式碼來源至參考網址

還有問題?馬上發問,尋求解答。