我有以下代码。
----HTML Part---
<div id="Optimize" class="Div"> Optimize </div>
----Jquery Part---
$('#Optimize').click(function()
{
var form_data = new FormData();
form_data.append('action',"Opt");
var perlURL= "$code";
$.ajax({
url: perlURL,
data: form_data,
type: 'post',
datatype: "script",
success: function(result) {
},
});
});
用户点击Optimization后,将执行以下jquery代码并将结果显示给用户。现在,只要用户单击“优化”以显示正在加载数据,我就需要插入一个Spinner。加载数据后,微调器应该停止。所以我有两个功能。如果我插入这两个函数,Jquery代码将如下所示。
$('#Optimize').click(function()
{
startSpin(); // ------------------------START SPIN HERE----------------
var form_data = new FormData();
form_data.append('action',"Opt");
var perlURL= "$this_code";
$.ajax({
url: perlURL,
data: form_data,
type: 'post',
datatype: "script",
success: function(result) {
stopSpin(); // --------------STOP SPIN HERE --------------
},
});
此代码应按预期工作。一旦用户点击&#34;优化&#34;就会启动微调器。但它并没有开始。我感觉它会立即以异步方式执行。
我如何确保用户执行startSpin();首先,然后是功能的后半部分?
我已经阅读了promise()并尝试了各种方法同时执行这两个功能。但无法成功。
答案 0 :(得分:0)
这肯定会对某人有所帮助。我尝试在jquery中使用bind函数,并尝试将这两个函数绑定到onclick事件。这是不成功的。
然而,经过几次重试,我想到了在javascript函数中使用jquery函数。所以现在这两个函数都是普通的javascript函数。我做了以下。
-----------HTML CODE-------------
----------START SPIN HERE------------
<div class="Div" onclick="startSpin();setTimeout(function() { runopt(); }, 100); " > Run Optimization </div>
-----------SCRIPT CODE-------------
<script type="text/javascript">
function runopt() {
//$('#Optimize').click(function()
// {
var form_data = new FormData();
form_data.append('action',"Opt");
var perlURL= "$code";
$.ajax({
url: perlURL,
data: form_data,
type: 'post',
datatype: "script",
success: function(result) {
},
});
stopSpin(); // -----------------STOP SPIN HERE -----------------
// });
}
脚本中注释掉的值意味着早期的代码。我已经在html侧使用了两个函数onclick并将第二个函数延迟了100毫秒。它成功了。允许第一个函数运行,然后运行第二个函数{runopt()}。