隱藏和顯示DIV文件

我使用ASP.net MVC和下面是HTML代碼隱藏和顯示DIV文件

$.ajax({ 
     type: "POST", 
     url: urlAjax, 
     dataType: 'json', 
     data: dataValue, 
     async: false, 
     beforeSend: function() { 
      $("#waitscreen").show(); 
     }, 
     complete: function() { 
      $("#waitscreen").hide(); 
     }, 
     success: function (data) { 
      alert("success") 
     }, 
     error: function (jqXHR, textStatus, error) { 
      alert("fail") 
     } 
    }); 


<div id=waitscreen> 
    //some code 
</div>

代碼在外部JS

function _post(someparameter) 
{ 
    $.ajax({ 
      type: "POST", 
      url: urlAjax, 
      dataType: 'json', 
      data: dataValue, 
      async: false, 
      beforeSend: function() { 
       $("#waitscreen").show(); 
      }, 
      complete: function() { 
       $("#waitscreen").hide(); 
      }, 
      success: function (data) { 
       alert("success") 
      }, 
      error: function (jqXHR, textStatus, error) { 
       alert("fail") 
      } 
     }); 
}

也嘗試添加文件準備在上面的代碼它仍然不工作

上面的代碼工作正常，它顯示和隱藏如預期的，但現在我需要在每個頁面重複ajax調用，所以我決定移動外部JS文件現在相同的代碼是n不顯示waitscreen。

事情我想：

加載外部腳本頭 - 不工作
加載的頁面的結束外部腳本 - 不工作

問：我想使隱藏和顯示從外部JS文件工作

來源

2017-02-28 Harshal Bulsara

瀏覽器開發控制檯中的任何錯誤？ jQuery是否包含在其他頁面上的腳本之前？你確定外部腳本實際上在運行嗎？你看到成功處理程序的警報嗎？只是爲了仔細檢查，你所有的其他HTML頁面*都*有一個與該ID的div？ – nnnnnn

把你的代碼放在$（document）裏面。ready（function（）{}）; –

在'$（document）.ready（function（）{....}）中包裝你的代碼;'並檢查 –

以下代碼片段可以幫助您。通過在主文檔的<head>中包含外部JS文件進行測試，並且在jQuery的包含之下。

// main window 
 
var json = {"key": "value"} 
 
    console.log('before calling _post()'); 
 
    _post(json); // call external JS 
 

 

 
// code in external JS say test.js 
 
function _post(someparameter) 
 
{ 
 
    console.log('external JS called!'); 
 
    $.ajax({ 
 
      type: "POST", 
 
      url: 'http://www.niketpathak.com', 
 
      dataType: 'json', 
 
      data: someparameter, 
 
      async: true, 
 
      beforeSend: function() { 
 
       $("#waitscreen").show(); 
 
      }, 
 
      complete: function() { 
 
      // $("#waitscreen").hide(); 
 
      }, 
 
      success: function (data) { 
 
       alert("success") 
 
      }, 
 
      error: function (jqXHR, textStatus, error) { 
 
       //delaying the error callback 
 
       setTimeout(function() { 
 
        $("#waitscreen").hide(); 
 
        console.log('after completing the http-request'); 
 
       }, 500); 
 
      } 
 
     }); 
 
};

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id=waitscreen> 
 
    Waitscreen.... 
 
</div>

另外請注意，我已經使用async: true（這也是默認值），因爲它設置爲false是棄用，而不是一個好主意，因爲它會阻止用戶界面。

來源

2017-03-16 14:42:14

我已經在其他頁面繼承的佈局中包含div和js文件，可能會導致這種情況無法正常工作？ –

我的ajax代碼在External.js文件中，

function _post() 
{ 
    var data = { 
    Email: "[email protected]", 
    Password:"1111" 
    } 
$.ajax({ 
    type: "POST", 
    url: "/Home/hello/", 
    dataType: 'json', 
    data: data, 
    async: false, 
    beforeSend: function() { 
     $("#waitscreen").show(); 
    }, 
    complete: function() { 
     $("#waitscreen").hide(); 
    }, 
    success: function (data) { 
     alert("success") 
    }, 
    error: function (jqXHR, textStatus, error) { 
     alert("fail") 
    } 
});

}

在我的HomeController中，我有hello方法就是這樣，

[HttpPost] 
    public ActionResult hello(LoginViewModel data) 
    { 
     ViewBag.Message = "Your contact page."; 

     return Json(data, JsonRequestBehavior.AllowGet); 
    }

而在我所有的意見我有「等待屏幕」分區。現在我只需將External.js文件引用到我的_Layout頁面，我只需在jquery引用後拖放即可。

<script src="~/Scripts/External.js"></script>

然後在同一頁面_layout結束，我只需要調用這樣的方法，

<script> 
    _post(); 
</script>

一切工作正常。注意：如果你的hello動作方法中只有一個參數，並且假設你寫了（int x），那麼在這種情況下它將通過500個錯誤。因爲在你的RouteConfig.js中提到，默認情況下參數名稱應該是id。所以你需要編寫int id。希望得到它的幫助。

來源

2017-03-15 06:23:22

並在我所有的意見中，我有「waitscreen」div ..我需要把div放在所有頁面上，我可以只放在佈局中嗎？ –

您需要將該div放入要顯示的所有頁面中。否則，您可以創建一個局部視圖，然後在所有頁面中進行渲染。 BDW你正在得到哪個錯誤？這段代碼工作得很好。 –

我沒有得到任何關注的錯誤 –

隱藏和顯示DIV文件

回答

相關問題