Question

我想问一下如何设计一个有很多ajax调用的页面。例如，在一个具有CRUD功能的页面中调用10个ajax ..

目前我有这种自定义设置：

$('[data-ajaxform]').submit(function(event) {
event.preventDefault();
event.stopImmediatePropagation();

if(!$(this).parsley().validate()){
    return false;
}

var $this = $(this),
    url = $this.attr('action'),
    method = $this.attr('method'),
    container = $this.data('container');

if(typeof container !== undefined && container !== false)
    container = '.panel-body';

$.ajax({
    url: url,
    type: method,
    dataType: 'json',
    data: $this.serialize(),
    beforeSend: function(){
        $this.find(container).append('<div class="indicator show"><span class="spinner spinner1"></span></div>')
    },
})
.done(function(data) {
    setTimeout(function() {
        $this.find(container).prepend(data.responseText);
    }, 1000);
    $this.trigger('reset');
    hasValue($this.data('ajaxform'))
})
.fail(function(data) {
    setTimeout(function() {
        $this.find(container).prepend(data.responseText);
    }, 1000);
})
.always(function(data) {
    setTimeout(function() {
        $this.find('.indicator').remove();
    }, 1000);
});

return false;
});

你们可以向我建议实施这个或者一些可以帮助我的文章的好习惯吗？非常感谢你

Answer 1

由于没有提供太多细节，我的回答可能更为通用。以前在处理与你的问题非常相似的问题时，我将jQuery的.ajax()包装到一个接受自定义参数和/或回调函数的全局函数中，这会改变发送的消息和产生的行为。

function myajax(data, callback /*or wrap all stuff in an object literal*/) {
  //any preprocessing or conditionals
  //for example put your setting the url, method, container here
  $.ajax({
    url: url,
    type: type,
    data: data,
    success: callback
  });
}

简而言之，在整个代码中避免使用.ajax()样板，只使用一次，并使其具有通用性和灵活性。

如何设计有很多ajax调用的页面？

1 个答案: