1

ここでこの表示/非表示を設定しました: http://jsfiddle.net/TwDSx/38/

私がやりたいのは、コンテンツが表示されている場合はプラス記号を消し、コンテンツが表示されていない場合はマイナス記号を非表示にしてプラスを表示することです。

画像を使用してスワップアウトすることに関する記事を読みましたが、html/css を使用するだけでは何もありません。また、可能であればjavascriptをhtmlから除外し、外部から呼び出すだけにしたいと思います。

どんな助けでも大歓迎です！

4

3 に答える 3

1

編集 ：

クリック時にイベント ハンドラーをアタッチして、+または-ボタンの表示属性を切り替えることができます。

$('#hide,#show').click(function(){
  $('#hide,#show').toggle();
})

簡単なデモ: http://jsfiddle.net/TwDSx/39/

于 2012-06-19T00:29:18.033 に答える
0

最も簡単な解決策は、ボタンを1つだけ持つことで#toggleあり、そのボタンの内容を次のように変更することだと思います。

$('#toggle').click(function () {
    if (this.innerHTML == '-') {
        $('#content').slideUp('fast');
        this.innerHTML = '+';
    } else {
        $('#content').slideDown('slow');
        this.innerHTML = '-';
    }
});

フィドル

于 2012-06-19T02:20:29.237 に答える
0

I modified your Javascript a little and extended it so you can keep it in an external file, you just need to ensure you hide the #show div with CSS if you load the page with the content already showing, or vice-versa for the #hide.

The Javascript is as follows:

$('#show').click(function() {
    ShowClick();
});  

$('#hide').click(function() {
    HideClick();
});

//This Javascript can be external
function ShowClick() {
    $('#content').toggle('slow');
    $('#hide, #show').toggle();
};

function HideClick() {
    $('#content').toggle('fast');
    $('#show, #hide').toggle();
};

The Js-Fiddle can be seen here: http://jsfiddle.net/mtAeg/

于 2012-06-19T00:34:46.090 に答える