Question

我有一个div，我正在$(document).ready(function ())检查条件，然后决定是否显示。

div内有一个按钮，可以淡出整个div。问题是在调用fadeout()函数后，再次调用$(document).ready(function ())（即页面重新加载），它再次满足显示div的条件。

我希望在调用fadeout()函数后阻止页面重新加载。

HTML

<div class="success"><%: ViewData["successResult"] %>
<br /><br />
<span id="closenotification" class="buttons" onclick="fadeoutbox()"><a href="" ><img src="<%= Url.Content("~/Content/Images/door_out.png") %>" alt="" />Close</a></span>
</div>

的javascript

function fadeoutbox() {
    $(".success").fadeOut(5000, function () {
        /*$(".success").css("display", "none");
     $("#closenotification").css("display", "none");*/
    });

}

$(function () {
    var successres = '<%= ViewData["successResult"] %>';
    //alert(successres != null);
    if (successres != "") {
        var leftpos = screen.width / 2 - 350;
        var toppos = screen.height / 2 - 125;
        $(".success").css("left", leftpos);
        $(".success").css("top", toppos);
        $(".success").css("display", "block");
        $("#closenotification").css("display", "block");
    }

    if ($(".failure").html() != "") {
        var leftpos = screen.width / 2 - 350;
        var toppos = screen.height / 2 - 125;
        $(".failure").css("left", leftpos);
        $(".failure").css("top", toppos);
        $(".failure").css("display", "block");


    }
});

Answer 1

您已将图片包装在a标记中。您需要使用preventDefault来阻止页面在a标记的点击事件上重新加载。或完全删除a标记。

Answer 2

尝试将onclick事件移动到链接元素（嵌套到span中）并更改您的函数

function fadeoutbox(evt) {
    evt.preventDefault();
    $(".success").fadeOut(5000, function () {
       ...
    });
}

Answer 3

删除onclick="fadeoutbox()"部分并添加此处理程序：

$('#closenotification').click(function(e) {
    e.preventDefault();
    fadeoutbox();
});

Answer 4

试试这个：

$（function（）{

var successres = '<%= ViewData["successResult"] %>';
//alert(successres != null);
if (successres != "") {
    var leftpos = screen.width / 2 - 350;
    var toppos = screen.height / 2 - 125;
    $(".success").css("left", leftpos);
    $(".success").css("top", toppos);
    $(".success").css("display", "block");
    $("#closenotification").css("display", "block");

    return;
}

if ($(".failure").html() != "") {
    var leftpos = screen.width / 2 - 350;
    var toppos = screen.height / 2 - 125;
    $(".failure").css("left", leftpos);
    $(".failure").css("top", toppos);
    $(".failure").css("display", "block");

    return;
}

}）;

Answer 5

您可以执行以下任一操作：

将#放入href
在fadeoutbox
像其他人一样使用e.preventDefault()

调用jquery函数后重新加载页面

5 个答案: