Javascript 用jqtouch实现ajax加载微调器

我想知道我需要什么javascript或jquery函数来获得一个使用jqtouch的ajax加载微调器

我在一个页面上有一个搜索按钮，当点击该按钮时，它会提交到一个php文件，该文件会处理搜索结果，并在一个页面内逐行回显hthml中的结果 jqtouch自动将其放入新div中的div（这是我的第一个jqtouch应用程序，但这似乎非常标准，新的“页面”只是html中的新div）

我必须点击搜索按钮来触发javascript，因为“live”和类似的jquery函数在我正在测试的iphone上不会出现。 单击后，我知道调用一个函数来“显示”页面上的加载div，并在收到命令时将其隐藏，但我不知道如何检测php文件已完成对页面结果的处理，因为我不知道jqtouch是如何告诉这一点的

编辑

function popup(){
    $('#popup').ajaxStart(function(){
        $(this).show();
        });

    $('#popup').ajaxComplete(function(){
        $(this).hide();
        });     

    }

这可以在电脑上运行，但有一个bug，正如我在下面对bohzo的回复中所解释的，我如何让它在iphone上运行？

---

它在一个函数中，因为onclick操作在我的jqtouch实现中是必需的。

你可以使用，你可以使用，这在我的应用程序中非常适用

    function SubmitSearch()
    {
      $("#loading_gif").show();
      $.post('url to the php file', {var1: searchkey}, function(data) {
        $("#loading_gif").hide();

        //do something with returned data
        alert(data);
       });
    }

您可以在php文件中捕获搜索键$key=$\u POST[var1]；

---

希望这有帮助。

这在我的应用程序中对我很有用

    function SubmitSearch()
    {
      $("#loading_gif").show();
      $.post('url to the php file', {var1: searchkey}, function(data) {
        $("#loading_gif").hide();

        //do something with returned data
        alert(data);
       });
    }

您可以在php文件中捕获搜索键$key=$\u POST[var1]；

---

希望这有帮助。

这对使用Zepto的jQTouch有效（尚未使用jQuery进行测试）

CSS:

JS:

---

这适用于使用Zepto的jQTouch（尚未使用jQuery进行测试）

CSS:

JS:

---

它不叫“旋转器”。微调器是一个数字选择器，具有+/-一点视觉效果。不，在这种情况下，微调器是一个小的动画旋转gif，表示请求正在处理中。它不是“微调器”。微调器是一个数字选择器，具有+/-一点眼力不，在这种情况下，微调器是一个小的动画旋转gif，表示请求正在处理中。这似乎在我的计算机上工作，谢谢。在我接受答案之前，我会在我的iPhone上进行更多的测试，因为我知道jqtouch是什么样子的。好吧，它在电脑上工作得很好，但在iPhone上却没有预期的效果。第一次单击“搜索”时，加载的gif不会出现。如果我单击“上一步”并再次单击“搜索”，它将在第二次出现。如果您愿意发表您的意见，我的代码被编辑到我的问题中。这似乎在我的电脑上起作用，谢谢。在我接受答案之前，我会在我的iPhone上进行更多的测试，因为我知道jqtouch是什么样子的。好吧，它在电脑上工作得很好，但在iPhone上却没有预期的效果。第一次单击“搜索”时，加载的gif不会出现。如果我单击“上一步”并再次单击“搜索”，它将在第二次出现。如果您愿意给出您的意见，我的代码将被编辑到我的问题中。

$(document).on('ajaxStart', function(){
    $('#loading').addClass('current');
});

$(document).on('ajaxStop', function(){
    $('#loading').removeClass('current');
});