Question

我无法解释为什么这段代码仅适用于第一个函数。图像交换无法执行。

$(document).ready(function() {
$(function(){
// tip
    $("#tip").fancybox({
      'width'           : 420,
      'height'          : 300,
      'autoScale'       : true,
      'autoDimensions'  : true,
      'transitionIn'    : 'elastic',
      'transitionOut'   : 'fade',
      'overlayColor'    : '#111',
      'type'            : 'iframe'
    });
});
// image swap
$("#image1, #image2").click(function(){
  switch(this.id)
        {
        case 'image1':
          _(this.id,"../../img/answers.png","../../img/b13a(AC)ans.png");
          break;
        case 'image2':
          _(this.id,"../../img/answers(biggest4).png","../../img/b13b(AC)ans.png");
          break;
        }
    function _(id,main, alt){
        if($("#"+id).attr("src") == main) $("#"+id).attr("src", alt);
            else $("#"+id).attr("src", main);
    }
});

如果我将第二个函数放在单独的$（document）.ready（function（）中，两个例程都有效，但我试图避免重复。

Answer 1

您不必，$(function(){})与$(document).ready相同：

$(function() {
// tip
    $("#tip").fancybox({
        'width'           : 420,
        'height'          : 300,
        'autoScale'       : true,
        'autoDimensions'  : true,
        'transitionIn'    : 'elastic',
        'transitionOut'   : 'fade',
        'overlayColor'    : '#111',
        'type'            : 'iframe'
    });
// image swap
    $("#image1, #image2").click(function(){
        switch(this.id) {
            case 'image1':
                _(this.id,"../../img/answers.png","../../img/b13a(AC)ans.png");
                break;
            case 'image2':
                _(this.id,"../../img/answers(biggest4).png","../../img/b13b(AC)ans.png");
                break;
        }
        function _(id,main, alt){
            if($("#"+id).attr("src") == main) $("#"+id).attr("src", alt);
                else $("#"+id).attr("src", main);
        }
    });
});

避免重复$（document）.ready（function（）标记

1 个答案: