重做ajax功能

Is there a way to make a function that converts default ajax function.

This is the ajax function i have

$.ajax({
    type: "POST",
    url: "http://" + document.location.host + '/userajax',
    data: 'type=register&name=' + name,
    beforeSend:function() {

    },
    success: function(response) {

    }
});

This is what i want it to look like

ajax('url', {
    method: 'get',
    parameters: {
        name: $('#name').val()
    },
    beforeSend: function() {

    },
    success: function(transport) {

    }
});

Ive tried to search on the internet but did not find anything

I don't think so. but you can do this:

$(document).ready(function(){

    var parameters = {
            name:       $("#name").val(),
            desc:       $("#desc").val()

        };

        $.ajax({
            url: 'path/to/file',
            data : parameters,
            beforeSend: beforeSubmit,
            dataType: "json",
            type : 'POST',
        })
        .done(function(data) {


        })
        .fail(function() {
            console.log("error");
        })
    })

Also note I don't set the function for the beforeSend directly in the call, I will create an externe function which gives me more freedom.

so I could do this:

function beforeSubmit(){
   if(something !== 'somethingelse'){
       return false; //ajax call will stop
   }else{
       return true; //ajax call
   }
}

Sure, you can create the function like this:

function ajax(url, params){

    // everything is now available here
    console.log( url ); // output: http://www.google.com

    // you can get the data of the params object like this
    console.log( params.method ); // output: get

    // you can execute the beforeSend like this:
    params.beforeSend();

    // additionally you might want to check everything.
    // maybe if the method is NOT set, you want it to always use GET
    switch(arguments.length) {
        case 1: url = throw new Error('Url should be set');
        case 2: params.method = 'get';
        case 3: break;
        default: throw new Error('illegal argument count')
    }

}

You would call this like:

ajax('http://www.google.com', {
    method: 'get',
    parameters: {
        name: $('#name').val()
    },
    beforeSend: function() {
        // some function
    },
    success: function(transport) {
        // some function
    }
});

This certainly is possible, it's just a bit of work. Some of the basics you need:

First of all, you need a good understanding of the XMLHTTPRequest API, you can find more info on that on MDN.

Next, finding out how to do a callback, that is actually quite simple, you can pass an anonymous function reference as an option or attribute for a function. That goes like this:

function doSomething(variable, callback){
  variable = variable + ' something'; // just doing something with the variable
  callback(variable);
}

// then call the function with a callback (anonymous function)
doSomething('doing', function(result){ alert(result); });

You should get an alert that says 'doing something'.

And finally you should know how to read an object, passed as 'options' in the ajax function. Say you have a function like this:

function foo(url, options){
  console.log(url);
  console.log(options.method);
  console.log(options.parameters.name);
}

// call it like this
foo('https://google.com/', {
    method: 'get',
    parameters: {
        name: 'myName'
    }
});

That should log the url, method and parameters in the console.

Now from here, you should have all the pieces to put the puzzle together. Good luck!