【问题标题】:ASP.NET,jQuery UI Dialog showing in page for 1-2 secondsASP.NET,jQuery UI 对话框在页面中显示 1-2 秒
【发布时间】:2010-10-27 15:26:48
【问题描述】:

我有一个 ASP.NET 页面,我将在页面加载时检查用户是否已登录系统(通过检查会话值),如果未登录,它将显示一个用于登录的 jQueryUI 对话框。

我的 ASPX 页面在 head 标签中包含这些脚本

<style type="text/css">
    body { font-size: 62.5%; }
    label, input { display:block; }
    input.text { margin-bottom:12px; width:95%; padding: .4em; }
    fieldset { padding:0; border:0; margin-top:25px; }
    h1 { font-size: 1.2em; margin: .6em 0; }
    div#users-contain {  width: 350px; margin: 20px 0; }
    div#users-contain table { margin: 1em 0; border-collapse: collapse; width: 100%; }
    div#users-contain table td, div#users-contain table th { border: 1px solid #eee; padding: .6em 10px; text-align: left; }
    .ui-button { outline: 0; margin:0; padding: .4em 1em .5em; text-decoration:none;  !important; cursor:pointer; position: relative; text-align: center; }
    .ui-dialog .ui-state-highlight, .ui-dialog .ui-state-error { padding: .3em;  }


</style>
<script type="text/javascript">
$(function() {

    var name = $("#name"),
        email = $("#email"),
        password = $("#password"),
        allFields = $([]).add(name).add(email).add(password),
        tips = $("#validateTips");

    function updateTips(t) {
        tips.text(t).effect("highlight",{},1500);
    }


    function checkRegexp(o,regexp,n) {

        if ( !( regexp.test( o.val() ) ) ) {
            o.addClass('ui-state-error');
            updateTips(n);
            return false;
        } else {
            return true;
        }

    }

    $("#dialog").dialog({
        bgiframe: true,
        autoOpen: false,
        height: 250,
        modal: true,
        buttons: {
                Cancel: function() {
                $(this).dialog('close');
                },                                  
                NewUser: function() {
                 $(this).dialog('close');
                 window.location.href="Register.aspx";
                },
                'Sign in': function() {
                var bValid = true;
                allFields.removeClass('ui-state-error');


                bValid=true;
                isValidationFails=false;
                if (bValid)
                {              
                                        // Go to another page

                    } 
                }
            }
        },
        close: function() {
            allFields.val('').removeClass('ui-state-error');
        }
    });



    $('#create-user').click(function() {
         $(this).dialog('close');
         window.location.href="Register.aspx"
    })
    .hover(
        function(){ 
            $(this).addClass("ui-state-hover"); 
        },
        function(){ 
            $(this).removeClass("ui-state-hover"); 
        }
    ).mousedown(function(){
        $(this).addClass("ui-state-active"); 
    })
    .mouseup(function(){
            $(this).removeClass("ui-state-active");
    });

//});
var isAuthenticated = $("#isAuthenticated").val();
if (isAuthenticated && isAuthenticated == "false")
{
  $("#dialog").dialog("open");
}

});

</script>

服务器端代码(在 Page_Load 中)

 if (Session["trCustomerId"] != null)
        {
            Response.Write("Logged in user");
            ClientScript.RegisterHiddenField("isAuthenticated", "true");
        }
        else
        {
            ClientScript.RegisterHiddenField("isAuthenticated", "false");
        }

程序现在运行良好。但问题是当页面加载时,它在屏幕上显示 UIDialog div 1-2 秒然后消失。我不想这样显示。谁能告诉我如何解决这个问题?

【问题讨论】:

    标签: asp.net jquery user-interface


    【解决方案1】:

    尝试将对话框标记的样式设置为 display:none;

    #dialog{
       display: none;
    }
    

    如果 dialog.open 不适合您,您可以显示它。

    $('#dialog').show()
    

    【讨论】:

      【解决方案2】:

      试试这个,在 html 代码中输入 style="display:none;"对于#dialog 浏览器先加载html

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 2015-04-05
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多