发表新帖
发表新帖

jQuery should I use multiple ajaxStart/ajaxStop handling

后端 未结
关注
2 495
感情败类
感情败类 2020-12-04 16:30

Maybe there is no difference, but is either way better than the other (or perhaps a mysterious \'third\' way better than both!)...

first:

var
相关标签:
2条回答
  • 一生所求
    2020-12-04 16:46

    Use Ajax Call This Way ....

    <!DOCTYPE html>
<html lang="en">
<head>
<title>Shouting Code</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet"
	href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
<script
	src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script
	src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js">
  </script>
</head>
<body>
	<button type="submit" class="btn btn-default"
		onclick="ajaxRequest(this);">
		<i class="fa fa-refresh"></i> Ajax Call
	</button>
	<script>
  function ajaxRequest(id) 
    {
    	 // ajax request
        $.ajax({
            type: 'post',
            url: '/echo/html/',
            data: {
                html: '<p>This is echoed the response in HTML format</p>',
                delay: 600
            },
            dataType: 'html',
            beforeSend: function() { 
           	    //  alert("start");
				$(id).find('i').addClass('fa-spin');
			},
            success: function(data) {
                alert('Fired when the request is successfull');
            },
            complete:function(){  
                 //   alert("stop");
				$(id).find('i').removeClass('fa-spin');
			}
        });
}</script>
</body>
</html>

    0 讨论(0)
  • 伪装坚强ぢ
    2020-12-04 16:50

    An interesting fact is that ajaxStart, etc. are actually just jQuery events. For instance:

    $("#lbl_ajaxInProgress").ajaxStart(function() {
  // update labels
  $(this).text('Yes');
});

    is equivalent to:

    $("#lbl_ajaxInProgress").bind("ajaxStart", function() {
  // update labels
  $(this).text('Yes');
});

    This means that you can also attach namespaces to ajaxStart/ajaxStop, etc. Which also means that you can do:

    $("#lbl_ajaxInProgress").unbind("ajaxStart ajaxStop");

    You could also do:

    $("#lbl_ajaxInProgress").bind("ajaxStart.label", function() {
  // update labels
  $(this).text('Yes');
});

$("#lbl_ajaxInProgress").bind("ajaxStop.label", function() {
  // update labels
  $(this).text('No');
});

    And then:

    $("#lbl_ajaxInProgress").unbind(".label");

    Cool, huh?

    0 讨论(0)
 看不清?
提交回复
热议问题