jQuery ajax（）函数-内容无法加载

Question

I'm using jQuery and I've got problem with ajax() function. It doesn't seem to be a difficult problem but anyway I don't know what's going on. I'd like to load content from another html file using ajax, here's my code:

$(function(){
$('.submit-1').click(function(){
    $('.right').load('ajax.html .page-2');
});});

It works perfectly when I run it on NetBeans IDE - when I click the button, content loads. The problem is that it doesn't work without Netbeans, for example - when I open index.html.

Answer 1

Run your code in a server(apache,nginx), ajax cannot run without a server

use prevent default if your element is a link or a submit button

$(function(){
$('.submit-1').click(function(e){
    e.preventDefault();
    $('.right').load('ajax.html .page-2');
});});

Answer 2

Use preventDefault function. hope it will help

$(function(){
 $('.submit-1').click(function(e){
 e.preventDefault();
 $('.right').load('ajax.html .page-2');
});});

Answer 3

Maybe it solves your problem when you installing a server. With Apache it's very easy to do this. Just install it and configure/start Apache. With XAMPP you can also install a Database and it supports PHP and PERL.

Answer 4

you can try this

$('.submit-1').click(function(){
    $.get( "ajax/test.html", function( data ) {
        $( ".result" ).html( data );
        alert( "Load was performed." );
    });
});

Answer 5

This is the solution

$(function(){
$('.submit-1').click(function(){     
$.get('yourURL/home.html', function (data) {
    $('.right').append(data);
   });
});

you need to append the data retuned from server. The 'data' variable in the call back function holds the complete html from home.html