Question

我有一个网页，我使用Visual Basic在.net 4.0下开发。我有一个带有一些按钮的简单页面。当我点击一个特定的按钮时，我执行一个使用jalert（）的javascript函数。警报正确显示，但随后自动关闭，而不必单击显示的对话框上的“确定”按钮。

这是我的网页代码：

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="test.aspx.vb" Inherits="AccuRecordDirect.test1" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0     Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title id="titleTag">
</title>    
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link href="~/bootstrap/content/bootstrap.css" type="text/css" rel="stylesheet" />       
<script src="~/bootstrap/Scripts/jquery-1.9.1.js" type="text/javascript"></script>
<script src="../../bootstrap/scripts/js/jquery/jquery.js" type="text/javascript"></script> 
<script src="../../bootstrap/scripts/js/jquery/jquery.ui.draggable.js" type="text/javascript"></script> 
<script src="../../bootstrap/scripts/js/jquery/jquery.alerts.js" type="text/javascript"></script>
<link href="../../bootstrap/scripts/js/jquery/jquery.alerts.css" rel="stylesheet" type="text/css" media="screen" />

<script src="~/bootstrap/Scripts/bootstrap.js" type="text/javascript"></script>
<link href="~/Styles/Site_vsta.css" rel="stylesheet" type="text/css"/>
<link href="~/bootstrap/content/Site_vsta.css" type="text/css" rel="stylesheet" /> 

<style type="text/css">
@media (min-width:992px) {
.mobile-only {display:none;}
}

@media (max-width: 991px) {
.desktop-only {display:none;} 
}
</style>

</head>

<body>
<form id="form1" runat="server">
    <div class="container body-content">
        <div class="row">            
            <div class="col-sm-7 col-sm-offset-1">
                <div class="panel panel-default mobile-only" style="margin-left:auto; margin-right:auto;">
                    <div class="panel-heading"">
                        <asp:Label ID="Label7" runat="server" Text="Online Enrollment - Investment Elections" CssClass="panel-title mobile-only"></asp:Label>
                    </div>
                    <div class="panel-body">
                        <div class="row">
                            <div class="col-sm-10 col-sm-offset-1">
                                <asp:Label ID="Label3" runat="server" Text="Select how you want to set up your investment elections and click the <B><I>Next</I></B> button below." CssClass="control-label mobile-only"></asp:Label>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-10 col-sm-offset-1">
                                <asp:Label ID="Label6" runat="server" Text="&nbsp;" CssClass="control-label mobile-only"></asp:Label>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-10 col-sm-offset-1">
                                <asp:Button ID="btnCancel_M" runat="server" Text="Cancel" CssClass="btn btn-primary btn-sm mobile-only" />
                                <asp:Button ID="btn_Target_M" runat="server" Text="Target" CssClass="btn btn-primary btn-sm mobile-only" />
                                <asp:Button ID="btn_Risk_M" runat="server" Text="Risk" CssClass="btn btn-primary btn-sm mobile-only" />
                                <asp:Button ID="btn_Select_M" runat="server" Text="Select" CssClass="btn btn-primary btn-sm mobile-only" />
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</form>

<script type="text/javascript" language="javascript">
    function showPopup_M() {
        jAlert('We encourage you to take the investment risk', 'Risk Category Selected');
    }    
</script>

</body>
</html>

这是我的代码隐藏：

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
    If (Not Page.IsPostBack) Then
        Me.btn_Risk_M.Attributes.Add("onclick", "javascript:showPopup_M();")
    End If
End Sub

非常感谢任何帮助。

谢谢你，乔纳森

Answer 1

您的按钮正在执行表单帖子（PostBack）。这是正常的行为。 PostBack将刷新页面，因此任何使用javascript完成的客户端操作都将丢失。

将按钮属性更改为

btn_Risk_M.Attributes.Add("onclick", "showPopup_M(); return false;")

或者，如果您没有使用该按钮的任何asp.net功能（OnClick，Visibility等），您可以将其更改为非aspnet功能。

<input type="button" onclick="showPopup_M()" value="Risk" class="btn btn-primary btn-sm mobile-only" />

自定义jquery警报自动关闭

1 个答案: