AJAX reload div after complete

问题

I am trying to reload just a div once a function has been clicked and executed.

$('newThread').addEvent('submit', addThread);

function addThread(e){
    e.stop();
    var threadRequest = new Request.JSON({
        url: 'control.php?action=createThread',
        onSuccess: createThreadSuccess
    }).post(this);
}

function createThreadSuccess() {
    new Element('span',{
        'text':'Post successful.'
    }).inject($(threadList));

I have been using location.reload(true); but am I correct in saying this will reload the whole page and not just the the div I am after?

Once the createThreadSuccess has been executed I wish for the threadList div to reload, I have been using this link for advice but it doesn't seem to work in a jsFiddle

Please note I am using MooTools NOT jQuery

回答1:

You cannot 'reload a div'. A div is just a single element on an entire webpage, and on its own it has no URL it was loaded from, so it cannot be reloaded. You can set/replace the contents of a div with an Ajax call, but that's definitely not 'reloading' - you'd need to explicitly define the URL to load its new content from.

If you want to explicitly replace a div's contents by loading it from a remote URL, you should use Request.HTML instead of Request.JSON, and supply the element (or its ID) as the update parameter:

update - (element: defaults to null) The Element to insert the response text of the Request into upon completion of the request.

If you are just looking to replace the contents of an element without remote loading, you can simply do:

$('id-of-div').set('text', 'Text to be placed inside the element');

Or:

$('id-of-div').set('html', '<p>HTML ending up <em>inside</em> the div</p>');

Or build an entire subtree as you did with the new Element call already.

As for the secondary question: location.reload() is just shorthand for window.location.reload() so yes, it will reload the entire page (or frame). It can because a window or frame actually has a location it was loaded from.

来源：https://stackoverflow.com/questions/16430491/ajax-reload-div-after-complete

标签

javascript

ajax

mootools