0

我有以下代码：

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

我试图把它变成一个单击事件，但似乎无法让它工作。我尝试了以下方法：

$('#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 回答