Question

我正在使用名为Chosen的下拉窗口小部件，其中包含一个带有href javascript:void(0)的锚点。当我点击下拉菜单时，它会起作用，但在IE上它会触发一个新的onbeforeunload事件，这令人沮丧，因为应用程序确认您是否要离开。显然，当您输入表单数据时，您不希望出现这些问题。

有没有办法在不改变选择库的情况下摆脱这个问题？

不幸的是：

window.onbeforeunload = function (e) {
    console.log(window.location);
};

也不记录javascript:void(0)，因此，我无法使用它来检查目标网址。

这种行为至少发生在IE9中，这就是我所关注的（不是旧的IE）。

Answer 1

我能看到的唯一解决方案是将false的返回添加到链接的onclick事件处理程序中。它会告诉IE，您不打算通过单击链接来更改页面。

<a href="javascript:void(0);" onclick="doSomething(); return false;">Link</a>

同样可以这样写：

<script>
    function doSomething() {
        // do Something
        return false;
    }
</script>

<a href="javascript:void(0);" onclick="return doSomething();">Link</a>

Answer 2

我最终听到针对锚点的点击事件并取消事件以防止onBeforeUnload被触发：

$chosen.find('.chzn-single').click(function() {
    return false;
});

Answer 3

我知道这已经很久了......但是我最近因为我的工作而遇到过这个问题。遗憾的是，我们仍被迫支持IE9。我们在这个项目中使用Angular.js，当用户点击带有data-ng-click的锚标记时，它会动态地将新内容加载到页面上。

在您的示例中，您所要做的就是传递事件，并在函数内阻止默认操作并阻止它冒泡。要做到这一点，你所要做的就是：

// Inside the HTML
{...}
<a href="javascript:void(0);" onclick="doSomething(evt);">Link</a>
{...}
<script>
    function doSomething(evt) {
        evt.preventDefault();
        evt.stopPropagation();
        // Do Something
    };
</script>
{...}

在Angular，我所做的就是以下内容：

// Inside the View
<a href="javascript:void(0)" data-ng-click="addStuff($event)">Add Stuff</a>

// Inside the controller
function addStuff($event) {
    $event.preventDefault();
    $event.stopPropagation();
    // Do Something
};

我希望这不会太晚，我希望它能帮助别人。

Answer 4

有同样的问题。刚发现你的问题。我的解决方案是，您需要将onclick属性添加到每个选定的下拉列表锚标记并调用window.onbeforeunload = null

在我的情况下，我已经把

$(".chzn-single").attr("onclick", "window.onbeforeunload = null;");

设置选定的库后，它可以正常工作

Answer 5

不要使用href。一个简单的解决方案，最少的额外工作：

我更喜欢使用模拟href的CSS类，显然你会改变这个类的颜色和样式以适合你的网站，但为了这个目的，它是标准的蓝色下划线链接

<style>
    .linkSimulate
    {
        cursor: pointer;
        COLOR: blue;
        text-decoration: underline;
    }
</style>

然后使用简单的锚点

<a onclick = "do_save();" class ="linkSimulate">Link</a>

Answer 6

即使这个问题已经过去了，我也提高了@Bartosz的答案，在@Oiva Eskola的评论中解决了这个问题：

点击选定的链接元素后，这不会阻止window.onbeforeunload工作吗？ - var thisOnClick;

以下是我正确创建HTML onclick属性的解决方案，以便不覆盖或取消事件：

            var thisOnClick;

            $.each( $(' .container a '), function(){

                thisOnClick = $(this).attr('onclick');

                if ( typeof thisOnClick == 'undefined' ) {

                    $(this).attr('onclick', 'window.onbeforeunload = null;');

                } else if ( typeof thisOnClick == 'string' && thisOnClick.indexOf('window.onbeforeunload') == -1  ) {

                $(this).attr('onclick', thisOnClick + 'window.onbeforeunload = null;');
            }

        });

锚定“javascript：void（0）”导致window.onbeforeunload在IE上触发

6 个答案: