로드 후 jQuery 효과가 작동하지 않습니다 more

Question

Drupal 7을 사용하고 있고 페이지의 View 모듈로 내 콘텐츠를 가져 왔습니다. 그리고 내 호출기 Views Load More 모듈. 그리고 내 썸네일 효과를 가져 가면 그림자가 생깁니다.이 코드를 사용하여 이미지를 가리 키십시오.

var hoverImg = '<div class="hoverimg"></div>'; 

    $(".thumb").each(function(){ 
     $(this).children("div").each(function(){ 
      $(this).find("a").append(hoverImg); 
     }); 
    }); 

    $(".thumb div").hover(function() { 
     $(this).find(".hoverimg").animate({ opacity: 'toggle' }); 
    }); 

$(".thumb").hover(function() { 
    $(this).find("div").each(function(){ 
     $(this).find(".shadow").fadeOut(500); 
    }); 
}); 

내 현재 미리보기 이미지에 숫자가 표시됩니다. 이 코드 :

var c = ''; 
var d = ''; 
$('.view-content div.views-row').each(function(){ 
    c = 0; 
    d = 0; 
    var i = 1; 
    d = $(this).find('.thumbimg').length; 
    $(this).find('.thumbimg').each(function(){ 
     sayi=i++; 
     $(this).append('<div class="img_no">0'+sayi+'</div>'); 
    }); 
}); 

모두 괜찮습니다. 시작 페이지의 모든 효과. 그러나 Load More 버튼을 클릭하면 내 효과가 다른 페이지에서 작동하지 않습니다.

/** 
* @file views_load_more.js 
* 
* Handles the AJAX pager for the view_load_more plugin. 
*/ 
(function ($) { 

    /** 
    * Provide a series of commands that the server can request the client perform. 
    */ 
    Drupal.ajax.prototype.commands.viewsLoadMoreAppend = function (ajax, response, status) { 
    // Get information from the response. If it is not there, default to 
    // our presets. 
    var wrapper = response.selector ? $(response.selector) : $(ajax.wrapper); 
    var method = response.method || ajax.method; 
    var effect = ajax.getEffect(response); 

    // We don't know what response.data contains: it might be a string of text 
    // without HTML, so don't rely on jQuery correctly iterpreting 
    // $(response.data) as new HTML rather than a CSS selector. Also, if 
    // response.data contains top-level text nodes, they get lost with either 
    // $(response.data) or $('<div></div>').replaceWith(response.data). 
    var new_content_wrapped = $('<div></div>').html(response.data); 
    var new_content = new_content_wrapped.contents(); 

    // For legacy reasons, the effects processing code assumes that new_content 
    // consists of a single top-level element. Also, it has not been 
    // sufficiently tested whether attachBehaviors() can be successfully called 
    // with a context object that includes top-level text nodes. However, to 
    // give developers full control of the HTML appearing in the page, and to 
    // enable Ajax content to be inserted in places where DIV elements are not 
    // allowed (e.g., within TABLE, TR, and SPAN parents), we check if the new 
    // content satisfies the requirement of a single top-level element, and 
    // only use the container DIV created above when it doesn't. For more 
    // information, please see http://drupal.org/node/736066. 
    if (new_content.length != 1 || new_content.get(0).nodeType != 1) { 
     new_content = new_content_wrapped; 
    } 
    // If removing content from the wrapper, detach behaviors first. 
    var settings = response.settings || ajax.settings || Drupal.settings; 
    Drupal.detachBehaviors(wrapper, settings); 
    if ($.waypoints != undefined) { 
     $.waypoints('refresh'); 
    } 

    // Set up our default query options. This is for advance users that might 
    // change there views layout classes. This allows them to write there own 
    // jquery selector to replace the content with. 
    var content_query = response.options.content || '.view-content'; 

    // If we're using any effects. Hide the new content before adding it to the DOM. 
    if (effect.showEffect != 'show') { 
     new_content.find(content_query).children().hide(); 
    } 

    // Add the new content to the page. 
    wrapper.find('.pager a').remove(); 
    wrapper.find('.pager').parent('.item-list').html(new_content.find('.pager')); 
    wrapper.find(content_query)[method](new_content.find(content_query).children()); 
    if (effect.showEffect != 'show') { 
     wrapper.find(content_query).children(':not(:visible)')[effect.showEffect](effect.showSpeed); 
    } 

    // Attach all JavaScript behaviors to the new content 
    // Remove the Jquery once Class, TODO: There needs to be a better 
    // way of doing this, look at .removeOnce() :-/ 
    var classes = wrapper.attr('class'); 
    var onceClass = classes.match(/jquery-once-[0-9]*-[a-z]*/); 
    wrapper.removeClass(onceClass[0]); 
    var settings = response.settings || ajax.settings || Drupal.settings; 
    Drupal.attachBehaviors(wrapper, settings); 
    } 

    /** 
    * Attaches the AJAX behavior to Views Load More waypoint support. 
    */ 
    Drupal.behaviors.ViewsLoadMore = { 
    attach: function (context, settings) { 
     if (settings && settings.viewsLoadMore && settings.views.ajaxViews) { 
     opts = { 
      offset: '100%' 
     }; 
     $.each(settings.viewsLoadMore, function(i, setting) { 
      var view = '.view-id-' + setting.view_name + '.view-display-id-' + setting.view_display_id + ' .pager-next a'; 
      $(view).waypoint(function(event, direction) { 
      $(view).waypoint('remove'); 
      $(view).click(); 
      }, opts); 
     }); 
     } 
    }, 
    detach: function (context, settings, trigger) { 
     if (settings && Drupal.settings.viewsLoadMore && settings.views.ajaxViews) { 
     $.each(settings.viewsLoadMore, function(i, setting) { 
      var view = '.view-id-' + setting.view_name + '.view-display-id-' + setting.view_display_id + ' .pager-next a'; 
      $(view, context).waypoint('destroy'); 
     }); 
     } 
    } 
    }; 
})(jQuery); 

가 어떻게이 문제를 해결 않습니다

내 조회수는 더 JS 코드를로드? 감사.

Answer 1

jQuery를 1.7.1 또는 1.7.2로 업데이트하고 $ .hover() 대신 $ .on()을 사용하십시오. $ .on()을 사용하면 기본적으로 핸들러를 각 요소에 개별적으로 부착해야합니다. 그래서처럼 연결 선택하고 .thumb으로 기본 컨테이너를 사용하여 트리거 선택기로 IMG 선택기를 .thumb : $ CSTE 연구진이 기존 영구 DOM 요소에 부착하고, 이벤트로 수신 대기

$('#main').on('hover', '.thumb', function() { 
    // do your hover stuff 
} 

제공된 선택자와 일치하는 하위 요소에서 트리거됩니다. 페이지를 렌더링 할 때 페이지에없는 객체에 이벤트 수신기를 연결하면 작동하지 않습니다. .live()는 jQuery 1.7.x에서 사용되지 않습니다.