event.stopPropagation() not working in chrome with jQuery 1.7

a 夏天 提交于 2020-01-03 17:22:48

问题


For some reason clicking the document isn't working in Chrome (the closeQuickView is not being called).

The elements are loaded via AJAX and so need to have .on() action (previously .live() which is now deprecated in jQuery 1.7)

Used the example given here: How do I detect a click outside an element? as a basis

$('html').on('click', '.poster:not(.active) .image-effect', function (event) {

        var obj = $(this).parent();

        // If there are no .close spans
        if (obj.find('.close').length === 0) {

            // Add the close element by javascript to remain semantic
            obj.find('.quick-view').append('<span class="close">&times;</span>');
        }

        // Close any open Quick Views
        closeQuickView();

        // Add the active class (controls opacity)
        obj.addClass('active');

        // Fade in the Quick View
        obj.find('.quick-view').fadeIn(200, 'easeInOutQuint');

        event.preventDefault();
        event.stopPropagation();

    });

    $('html').on('click', '.active', function () {
        return false;
    });

    $('html').on('click', '.close', function () {
        closeQuickView();
    });

    $('html').on('click', '.quick-view', function (event) {
        event.stopPropagation();
    });

    // Close the QuickView with a button
    $('html').on('click', function () {
        closeQuickView();
    });

    function closeQuickView() {
        $('.poster').removeClass('active');
        $('.quick-view').fadeOut(200, 'easeInOutQuint');
    }

My markup is as follows:

<figure class="grid_2 box poster">
    <a class="image-effect" href="#">
        <img class="colour" src="path/to/image" />
        <img class="bw" src="path/to/image" />
    </a>
    <div class="quick-view">

        Content

    </div>
</figure>

回答1:


Try event.stopImmediatePropagation

Refer documentation




回答2:


jquery 1.6.4 suffer the same bug. Resolved using stopImmediatePropagation.



来源:https://stackoverflow.com/questions/8021846/event-stoppropagation-not-working-in-chrome-with-jquery-1-7

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!