jQuery的 - 简单的文本肩与点击事件

Question

我使用简单Text Rotator和其梦幻般的，我的，我与它唯一的问题是单击事件我还没有与它的工作：

$(function() { 
     $('a[href*=#]:not([href=#])').click(function() { 
     if(!$(this).hasClass('carousel-control')){ 
       if (location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '') && location.hostname == this.hostname) { 
        var target = $(this.hash); 
        target = target.length ? target : $('[name=' + this.hash.slice(1) + ']'); 
        if (target.length) { 
          $('html,body').animate({ 
           scrollTop: target.offset().top - topSize 
          }, 2000); 
          return false; 
        } 
       } 
     } 
     }); 
    }); 

当我点击链接在文本旋转器它不滚动，只是去的ID部分（＃link-1 &＃link-2）（link-3.php和link-4.php工作正常，因为他们去另一个页面）

<h1 class="sliding-text"> 
     <span class="rotate"> 
      <a href="#link-1">Link 1</a>, 
      <a href="#link-2">Link 2</a>, 
      <a href="link-3.php">Link 3</a>, 
      <a href="link-4.php">Link 4</a> 
     </span> 
    </h1> 

    $(".sliding-text .rotate").textrotator({ 
     animation: "fade", 
     speed: 1000 
    }); 

这里是该库的jQuery代码：

!function ($) { 

    var defaults = { 
     animation: "fade", 
     separator: ",", 
     speed: 2000 
    }; 

    $.fx.step.textShadowBlur = function (fx) { 
     $(fx.elem).prop('textShadowBlur', fx.now).css({ textShadow: '0 0 ' + Math.floor(fx.now) + 'px black' }); 
    }; 

    $.fn.textrotator = function (options) { 
     var settings = $.extend({}, defaults, options); 

     return this.each(function() { 
      var el = $(this) 
      var array = []; 
      $.each(el.html().split(settings.separator), function (key, value) { 
       array.push(value); 
      }); 
      el.html(array[0]); 

      // animation option 
      var rotate = function() { 
       switch (settings.animation) { 

        case 'fade': 
         el.fadeOut(500, function() { 
          index = $.inArray(el.html(), array) 
          if ((index + 1) == array.length) index = -1 
          el.text(array[index + 1]).fadeIn(settings.speed); 
         }); 
         break; 
       } 
      }; 
      setInterval(rotate, 8000); 
     }); 
    } 

}(window.jQuery); 

如何让我的点击事件与我的文字转子工作

Answer 1

我不认为它的工作，因为文本旋转器插件被移除，并重新添加在DOM的链接。你可以通过使用delegated event binding来解决这个问题，如下所示：

$(function() { 
    $('.sliding-text').on('click', 'a[href*=#]:not([href=#])', function() { 
    // .. your code here 
    }); 
});