如果用户打开模式框并单击浏览器窗口中的“后退”按钮,则他应留在同一站点上。 eBay是一个很好的例子: http ://www.ebay.de/itm/NIKE-FLEECE-JOGGINGHOSE-HOSE-CUFFED-SWEATHOSE-TRAININGSHOSE-FREIZEITHOSE-/380751278122?pt=LH_DefaultDomain_77&var=&hash= item58a68b702a

如果单击图像,则会打开模式窗口,如果单击浏览器的后退按钮,则您将停留在同一页面上,而不是重定向到上一页。

如果用户单击浏览器中的“后退”按钮,我该如何使用jQuery来使用户停留在同一窗口中?

这是我的模态代码

    /**
     * Will be called when the detail page image slider was clicked..
     * Opens the lightbox with an image slider clone in it.
     *
     * @event onClick
     */
    onClick: function () {
        var me = this,
            plugin = me.$el.data('plugin_imageSlider');

        $.modal.open(me.$template || (me.$template = me.createTemplate()), {
            width: '50%',
            height: '50%',
            padding: '20px',
            animationSpeed: 350,
            additionalClass: 'image-gallery--modal no--border-radius',
            onClose: me.onCloseModal.bind(me)
        });

        me._on(me.$zoomInBtn, 'click touchstart', $.proxy(me.onZoomIn, me));
        me._on(me.$zoomOutBtn, 'click touchstart', $.proxy(me.onZoomOut, me));
        me._on(me.$zoomResetBtn, 'click touchstart', $.proxy(me.onResetZoom, me));

        picturefill();

        me.$template.imageSlider({
            dotNavigation: false,
            swipeToSlide: true,
            pinchToZoom: true,
            doubleTap: true,
            maxZoom: me.opts.maxZoom,
            startIndex: plugin ? plugin.getIndex() : 0,
            preventScrolling: true
        });

        me.toggleButtons(me.getImageSlider());


    },

    /**
     * Will be called when the modal box was closed.
     * Destroys the imageSlider plugin instance of the lightbox template.
     *
     * @event onCloseModal
     */
    onCloseModal: function () {
        var me = this,
            plugin = me.getImageSlider();


        if (!plugin) {
            return;
        }


        plugin.destroy();
    },

现在,如果用户单击浏览器后退按钮,则应该关闭模式,但用户应留在SAME站点上。

#1楼 票数:0

您只想对Jquery使用annyhow要做的事情有点复杂:

您需要捕获窗口发布事件,停止事件传播,然后关闭窗口。

在那之后,一切都会向前和向后执行。

var openedPopup = {
    opened = true,
    triigeredInLocation = "",
    ClonedObject = ""
}
openedPopup = undefined;

$(window).on("popstate", function (e) {
    if (e.originalEvent.state !== null) {
        if (openedPopup !=  undefined)
        {
            //Popup opened or closed on the page by back/forward
            if (openedPopup.triigeredInLocation.IndexOf(window.location.href) && openedPopup.triigeredInLocation.length == window.location.href.length)
            {
                if (openedPopup.opened)
                {
                    //whatever global method for closing your modal/all modals you are using
                    //don't know how to close your popup, this may be a stupid example
                    openedPopup.colonedSelector.CloseModal();
                    //stop event propagation
                    return false;
                }               
            }
        }
    }
}

在您发布的代码中进行模式打开状态对象的初始化/销毁:

 onClick: function () {
///...

openedPopup = {
        opened = true,
        triigeredInLocation = window.location.href,
        ClonedObject = this;
}
///$.modal.open(...
}

//...

 onCloseModal: function () {
//...
openedPopup = undefined;
//...
}

您甚至可以打开弹出窗口,如果按下了前进键,那么就足够了,希望您理解我试图解释的内容,我的代码虽然不能完全正常工作,但是可以根据需要进行调整。

  ask by user3633186 translate from so

未解决问题?本站智能推荐:

2回复

更改浏览器中按下后退按钮的行为以保留在同一站点上

通过按钮POST Edit Action提交后,我在视图中有一个表单。 如果用户在浏览器中单击“后退”按钮,我希望提交此表单或不进行任何操作(保留在同一页面上)。 问题:我可以更改Edit.cshtml视图的后退按钮的行为以使其不起作用吗? 我的意思是留在同一页面上? 在Razor视
4回复

检测两个浏览器窗口是否已打开到同一站点

我试图检测用户是否在一个选项卡中打开了我的网站,然后在另一个选项卡中将其打开。 然后,这应该在新打开的选项卡上向用户显示警告。 现在,我每秒都会向服务器发送一个“保持活动”的ajax调用。 然后,这将使用唯一ID在数据库中记录“上次激活”时间。 加载新页面时,它将检查该用户(由user
1回复

单击浏览器后退按钮时如何保持在同一页面上

我有2格,照片上显示红色。 显示加载后的Div1,隐藏Div2。 Div1中有4个div,其中包含4个onclick事件,这些事件调用ajax并隐藏div1并显示包含已加载数据的第二个。 单击浏览器的后退按钮时,我需要返回一页,并且我希望页面返回到默认位置,其中div1可见,并且di
1回复

如何在来自同一站点的不同页面加载中的浏览器JavaScript中维护状态?

我需要做一些非常简单的事情,即在不同页面加载中维护突出显示哪个面板栏项目。 我将其用作菜单,单击后立即突出显示所选菜单项,当该菜单项的链接(页面)返回时,该菜单会重新加载,而我却丢失了它,因此看起来不错。 如果我可以保留在本地状态,我真的不想仅使用ajax调用来管理会话变量,但是我还能在哪
1回复

如何检查锚点URL是否将转到同一站点(并平滑滚动,否则离开页面)?

我正在尝试创建一个防弹脚本,该脚本确实会使用jQuery动画滚动到锚点,但前提是该锚点的href位置指向我当前站点中的现有锚点。 这是脚本: 我的问题是要放入什么而不是##### CONDITION-PART ###### 。 如果锚点以井号标签开头,则只能位于同一页面上。 有锚链接
3回复

使用浏览器后退按钮删除模态

http://morningharwood.com/works单击右下角的项目按钮会显示一个非常基本的模式。 在测试时,我注意到后退按钮不会删除模态。 如何确保浏览器后退按钮将删除模态窗口? 这是完整的要点 HTML 社会保障局
2回复

php、ajax和html从同一站点打开一个网页,但在不同的div标签中

我将 php 文件与我的输出函数一起使用,即 do_header 和 do_body 等。 在 body 函数中,我有三个 div 标签,div 1、div 2、div 3。div 1 持有 div 标签 1 左侧和右侧的另外两个位置。 我在 div 2 中设置了一些链接,以便从网站上打开另一个页面
1回复

Highcharts可点击列以在同一站点上打开另一个页面

我正在制作一个生成图表的脚本(Highcharts)。 这工作正常,但我想添加一个“点击”功能,点击时打开同一网站上的另一个scropt。 阅读可点击的列后,我不知道如何使其工作。 如何点击列google.com 我的代码是: 非常感谢你的时间。