0

これが私がやりたいこと/やろうとしていることです。

フォームがあります。フォームには送信ボタンがあります。送信ボタンのonMouseDown（）イベントは次のとおりです。

<input type='submit' value='Search' name='save' id='save' onmousedown = 'DimOn("test.php", "SearchResultDiv")' />

さて、ボタンがクリックされたら、正確な順序で3つのことを実行したいと思います。

1）ページを暗くします。

2）Ajaxクエリを実行し、検索結果を入力します。

3）薄暗い部分を取り外します。

編集：

jQueryオブジェクトでbeforeSendおよびCompleteイベントを使用してみました

function DimOn(sUrl, sElement) 
{
    jQueryAjax(sUrl, sElement);
}

function jQueryAjax(sUrl, sElement) 
{
    $.ajax({
        url: sUrl,
        type: 'GET',
        async: false,
        cache: false,
        timeout: 1000,
        beforeSend: function(){
            $('#dim').fadeIn();
        },  
        complete : function(){
            $('#dim').fadeOut();
        },      
        error: function(){
            return true;
        },
        success: function(msg){ 
            if (msg != '')
                PopulateResponse(msg, sElement, false);
            else 
                PopulateResponse("An Error Has Occured.", sElement, false);
        }
    });
}

現在、次のように表示されます。

2）Ajaxクエリを実行し、検索結果を入力します。

2）ページを暗くします。

3）薄暗い部分を取り外します。

結果が表示され（10秒かかります）、調光器が非常にすばやく点滅します。

プログラマーの仲間を貸してください。私はこのテクノロジーに精通しており、非同期をオフにした理由は、何かを順番に実行しようとしましたが、それでもサイコロはありません。

4

1 に答える 1

2

私はこの関数でこの問題を解決しました：

function jax(sUrl, sElement, bEval, sType, bAsync) 
{
    $.ajax({
        url: sUrl,
        type: sType,
        async: true,
        cache: false,
        timeout: 30000,
        error: function()
        {
            return true;
        },
        beforeSend: function(){
            $('div#dim').fadeIn(400);
        },  
        complete : function(){
            $('div#dim').fadeOut(200);
            if(sUrl.search(/scroll=true/ig) != -1)
                goToByScroll(sElement);

        },                      
        success: function(msg){ 
            if (msg != '')
            {
                PopulateResponse(msg, sElement, bEval);
            }
            else
            {
                PopulateResponse("An error has occurred.", sElement, bEval)
                //Coming soon, ajax call to php file to log javascript failure.
            }
        }
    });
}

このCSS

div#dim
{
    background-color:#000;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
    filter: alpha(opacity=60);
    opacity:.6;
    height:100%;
    width:100%;
    position:fixed;
    top:0;
    left:0;
    z-index:1005;
    display:none;
    cursor:wait;
}

div#dim div
{

    position:relative;
    top:400px;
    z-index:1006;
    text-align:center;
    cursor:wait;
}

div#dim div img
{
    z-index:1007;
    text-align:center;
    border:none;
    cursor:wait;
}

とこのHTML

<div id='dim'><div style="text-align:center;"><img src="Images/Loading/loading10.gif" alt="Loading... please wait" title="Loading... please wait" /></div></div>
于 2012-12-19T13:59:02.460 に答える