0

ボタンをクリックしたいのですが、divが表示されます。同じボタンをクリックすると、divが消えます。

実際に登場するのは作品だけですが、どうやって隠しておくのですか?

スクリプト:

$('#button').click(function() {
  $('#ui-block-a').removeClass('visuallyhidden').addClass('ui-block-a'), function(){
  $('#ui-block-a').addClass('visuallyhidden').removeClass('ui-block-a');
  };
}); 

HTML:

 <div class="visuallyhidden" id="ui-block-a">
     <ul data-role="listview" data-filter="true" id="nav"></ul> 
 </div>

コールバックを使用しようとしましたが、機能していません...

4

2 に答える 2

5

クラスが最初から正しく設定されている場合は、 .toggleClass() [docs]を使用できます。

$('#ui-block-a').toggleClass('visuallyhidden ui-block-a');

それ以外の場合、クラスを明示的に追加/削除する場合は、次を使用できます.toggle()

$('#button').toggle(function() {
    $('#ui-block-a').removeClass('visuallyhidden').addClass('ui-block-a');

}, function(){
    $('#ui-block-a').addClass('visuallyhidden').removeClass('ui-block-a');
});

コードが機能しない理由:

コールバックを設定していません。コンマ演算子を使用して2つのステートメントを実行しています。最初の部分($('#ui-block-a').addClass('...').removeClass('...'))は期待どおりに実行されます。2番目の部分( )は関数式function() {...}として評価され、結果である関数がステートメントの全体的な結果として返されます。ただし、結果を何にも割り当てていないため、黙って無視されます。

たとえば、あなたがするなら

// form is like `var foo = x, y;`
var foo = $('#ui-block-a').removeClass('...').addClass('...'), function(){
    $('#ui-block-a').addClass('...').removeClass(...');
};

次にfoo、関数を参照します

function() { 
    $('#ui-block-a').addClass('...').removeClass('...');
}

しかし、それはとにかくあなたが望むものではありません。したがって、関数をそこに置くことは合法ですが、特別な意味はなく、したがって効果はありません。

于 2011-09-28T08:07:48.753 に答える
0

を使用します。少し気まぐれなtoggleClass場合もあるtoggleClassので、ifステートメントと変数を使用します。

sudoコードの場合:

variable = 0

if variable = 0
{
    Show Div
    variable = 1
}
else if variable = 1
{
    Hide Div
    variable = 0
}
于 2011-09-28T08:10:17.597 に答える