0

各スライダーのボタンを使用して切り替えられるページに jQuery スライド div があります。ボタンをクリックすると、コンテンツが下にスライドし、ボタン上のテキストが「もっと見る」から「閉じる」に変わります。ボタンをもう一度クリックすると、コンテンツが上にスライドし、ボタンのテキストが「もっと見る」に戻ります。以下に投稿したjQueryは、この機能で機能します。

URLにハッシュタグがあると、スライダーの1つが自動的にスライドダウンするようになりました。以下のコードでこれを機能させました。この自動スライド中にトリガーボタンのテキストが「閉じる」に変更されますが、ボタンをクリックしてスライドアップしても、テキストは「もっと見る」に戻りません。次に、トグルボタンをクリックすると、ボタンのテキストが再び変更され始めますが、今回は「もっと見る」ではなく「閉じる」から始まるため、以前の変更により本来あるべきものとは反対になります。それは意味がありましたか？ハハ。

ハッシュが自動的に開いた後に「閉じる」ボタンをクリックすると、テキストが「もっと見る」に変更されるように、jQueryをセットアップする方法はありますか? 助けてくれてありがとう

    <script language="javascript">
 $(document).ready(function() {

        $('#toggleButton1').click(function() {$('#toggleSection{row_count}').slideToggle('slow', function() {
         // Animation complete.
            });
        });
            $('#toggleButton1').toggle(
                function() {$('#toggleButton1').html('Close');
            },
                function() {$('#toggleButton1').html('View More');
           });

        {/facility_sections}
        {/exp:channel:entries}

        if (window.location.hash) {
            $('#toggleSection1').slideToggle('slow');
            $('#toggleButton1').html('Close');}
});
</script>
4

1 に答える 1

0

クリックボタンのテキストを変更しないのはなぜですか? このコードをクリック機能に追加できます

        $(document).ready(function() {
           $('#toggleButton1').click(function() {

           var buttonValue = $(this).val();
           switch(buttonValue)
           {
             case 'Close':
              buttonValue = 'View More';
              $('#toggleSection1').hide('slow');
              $('#toggleSection2').show('slow');
              break;
             case 'View More':
              $('#toggleSection1').show('slow');
              $('#toggleSection2').hide('slow');
              buttonValue = 'Close';
              break;
          }
          $(this).val(buttonValue);
   });
});

ここにhtmlがあります：

<div id='toggleSection1' style='display:none'>toggle section 1</div>
<div id='toggleSection2' style='display:none'>toggle section 2</div>

<input type='button' id='toggleButton1' value='View More' />​

別のオプションは、それが近いかどうかを示すブール値を持つことです。そのため、アクセスできる変数を宣言するだけです

var isClose = false;

ここにあなたが見ることができる簡単なコードがあります http://jsfiddle.net/2R9yE/11/

于 2012-06-15T01:58:38.993 に答える