1

我是 AJAX 和 JS 的初学者,所以请多多包涵。

我有一个可以在 2 个事件中工作的 AJAX:

  1. 页面加载时
  2. 单击按钮时

这个 AJAX 有url一些用于分页的变量:

url: "http://localhost/myurl/" + keyword + "/" + limit + "/" + offset

这个 AJAX 在页面加载时工作正常,但是当用户单击按钮时我不知道如何再次调用/使用它。

我把这个.click函数放在了它自己的 AJAX 中,所以基本上我需要调用父级。这是向您展示我想要做什么的代码:

$.ajax({
        url: "example" + limit + offset
        type: "GET",
        error : function(jq, st, err) {
            alert(st + " : " + err);
        },
        success: function(result){
        $("#btnLoad").click(function(){
                    //recall this AJAX again here
                                            offset = (page - 1) * limit;
                    page++;
                });
        }
        });

我知道复制粘贴代码可能有效,但我不想这样做,因为 AJAX 很长。

任何帮助表示赞赏,谢谢:D

4

7 回答 7

7

将其添加到事件处理程序中,并在页面加载时触发事件:

$("#btnLoad").on('click', function() {
    $.ajax({
        url: "example" + limit + offset
        type: "GET",
        ....
    });
}).trigger('click');
于 2013-08-02T10:11:36.950 回答
3

您可以抽象出 AJAX 调用。像这样:

$(document).ready(function(){
  //this is called when the page is loaded

  //variable that hold your offset and limit in the scope of the this function
  var limit = 10,
      offset = 0,
      page = 1;

  function ajaxCall(){
    $.ajax({
        url: "example" + limit + offset
        type: "GET",
        error : function(jq, st, err) {
            alert(st + " : " + err);
        },
        success: function(result){
          offset = (page - 1) * limit;
          page++;
        });
  };

  //register event for click on button
  $("#btnLoad").on('click', ajaxCall);


  //do the initial ajax call
  ajaxCall();

});

这不是一个完美的解决方案,但应该让你更接近你想去的地方。这里要考虑的事情是:

  • 当用户在成功回调更新偏移量和页面之前第二次单击按钮时会发生什么?
于 2013-08-02T10:24:31.407 回答
2

注意:这将在 $(document).ready() 内

点击你的ajax:

$("#my_btn").on("click",my_click_ajax)

        function my_click_ajax(){
                $.ajax({
                 type: 'POST',
                 url: 'your_url',
                 data: {a:some_value},
                 success: function(data) {
                        alert(data)
                 }
             });
            }

你的加载ajax:

注意:这将在 $(document).ready() 之外

window.onload=my_onload_ajax();
    function my_onload_ajax(){
         $.ajax({
                     type: 'POST',
                     url: 'your_url',
                     data: {a:some_value},
                     success: function(data) {
                            alert(data)
                     }
                 });
    }
于 2013-08-02T10:11:23.967 回答
2

您可以在方法中提取您的 ajax 调用:

// here you should to define 'limit' and 'offset' variables with init values
$("#btnLoad").on('click', method); 

var method = function() {
    $.ajax({
        url: "example" + limit + offset
        type: "GET",
        ....
    });
}

method(); // call method on page load
于 2013-08-02T10:13:32.983 回答
1

将您的 .ajax 文件放入 $(document).ready() 中,如下所示:

$(document).ready(function(){
   $('#yourid').click(function(){
   //some code here...
});
});
于 2013-08-02T10:12:59.733 回答
1

就像 Shivan 所说:创建一个函数并在页面加载和单击某些内容时调用它。像这样:

$(function(){
    MyAJAXFunction();
    $(".button").click(function(){
        MyAJAXFunction();
    });
});

function MyAJAXFunction() {
    // AJAX call here
}
于 2013-08-02T10:18:46.783 回答
1

据我了解,您希望在用户单击按钮时触发 ajax。如果您在 ajax 调用之外创建一个函数会更好。然后在成功时调用该函数。

div id="callAjaxRequestButton">Ajax Request</div>

$( "#callAjaxRequestButton" ).click(function() {  
                $.ajax({
                 type: 'POST',
                 url: "http://localhost/myurl/" + keyword + "/" + limit + "/" + offset,
                 data: {a:some_value},
              success: function(data) {
                    console.log(data)
              }
             });
);
}); 
于 2013-08-02T10:22:11.357 回答