gpt4 book ai didi

javascript - 在外部js文件的ajax调用中隐藏和显示div

转载 作者:搜寻专家 更新时间:2023-10-31 08:51:35 24 4
gpt4 key购买 nike

我用的是ASP.net MVC,下面是Html代码

 $.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")
}
});
}

也尝试在上面的代码中添加 document ready 它仍然无法正常工作

上面的代码工作正常,它按预期显示和隐藏,但现在我需要在每个页面中重复 ajax 调用,所以我决定移入外部 JS 文件,现在相同的代码不显示 waitscreen。

我尝试过的事情:

  1. 在 head 中加载外部脚本 - 不工作
  2. 在页面末尾加载外部脚本 - 不工作

问题:我想从外部 JS 文件中隐藏和显示作品

最佳答案

下面的代码片段应该能帮到你。通过在 <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 已弃用并且不是一个好主意,因为它会阻塞 UI。

关于javascript - 在外部js文件的ajax调用中隐藏和显示div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42500993/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com