0

次のコードがあります。

$('#picture-div').click(function(){
    $('#div-in-document').fadeToggle('slow', $func1);
});
$('#picture-div2').click(function(){
    $('#div-in-document2').fadeToggle('slow', $func2);
});

これを 1 回のクリック イベントにしようとしていますが、うまくいかないようです。私は次のことを試しました:

$('#picture-div ,#picture-div2').click(function(){
    if($(this) == '#picture-div')
        $('#div-in-document').fadeToggle('slow', $func);
    else
        $('#div-in-document2').fadeToggle('slow', $func2);
});

しかし、それは常にに行くelseので、私のifステートメントは無効です。

ありがとう。

4

3 に答える 3

3

data-*次のような属性を使用してマークアップを変更します。

<div class="picture-div" data-target="someId">...</div>
<div class="picture-div" data-target="someOtherId">...</div>

そして、あなたのjsは次のようになります:

var yourFunctions = {
  someId : function(){...}.
  someOtherId : function(){...}
}

$('.picture-div').click(function(){
  var target = $(this).data('target');
  $('#' + target).fadeToggle('slow', yourFunctions[target]);
});

保守性は安全です。万歳。

于 2013-07-06T13:58:54.943 に答える
0

多分このようなもの:

$('#picture-div ,#picture-div2').click(function(){
    if($(this).attr("id") == '#picture-div')
        $('#div-in-document').fadeToggle('slow', $func);
    else
        $('#div-in-document2').fadeToggle('slow', $func2);
});

または、一種のマッピングを作成できます。

var arr = [ { selector: "#picture-div", subselector: "#div-in-document", func: $func1},
            { selector: "#picture-div2", subselector: "#div-in-document2", func: $func2}]

ハンドラーを割り当てるためにそれを通過します:

for(int i = 0; i < arr.length; i++)
{
    $(arr[i].selector).click(function(){
      $(arr[i].subselector).fadeToggle('slow', arr[i].func);
   });
}
于 2013-07-06T13:55:32.243 に答える
0

代わりにこれを試してみてください。うまくいくことを願っています

$('#picture-div ,#picture-div2').click(function(){
    if($(this) == $('#picture-div'))
        $('#div-in-document').fadeToggle('slow', $func);
    else
        $('#div-in-document2').fadeToggle('slow', $func2);
});

私はそれをテストしていませんが、うまくいくと確信しています

于 2013-07-06T13:55:34.817 に答える