AJAX-Anforderung mit jQuery funktioniert nicht
Ich bin neu in jQuery und versuche, eine HTML-Seite mit Registerkarten einzurichten. Jede Registerkarte sollte eine andere HTML-Seite wie folgt anzeigen:
<div id="tabs">
<a href="page1.html"><div class="tabdiv tabActive">Page1</div></a>
<a href="page2.html"><div class="tabdiv">Page2</div></a>
<a href="page3.html"><div class="tabdiv">Page3</div> </a>
<a href="page4.html"><div class="tabdiv">Page4</div></a>
</div>
<div class="tabscontent" id="ajax-content">
Default text
</div>
Ich möchte also, dass beim Klicken auf Seite 1 die Seite 1.html in geladen wirddiv.tabscontent
. Dies ist der jQuery-Code, den ich habe.
$(document).ready(function() {
$("div#tabs a").click(function() {
alert(this.href);
$("#ajax-content").empty().append("Loading");
$("div#tabs div.tabdiv").removeClass('tabActive');
$(this).children('div.tabdiv').addClass('tabActive');
$.ajax({
url: this.href,
success: function(html) {
$("#ajax-content").empty().append(html);
alert("Success!");},
error: function() {
$("#ajax-content").empty().append("Didn't work");}
});
return false;
});
});
Hinweis: 1) Ich habe die neueste JQuery angehängt. 2) Ich habe die page1.html, page2.html usw. im selben Ordner wie die oben genannte HTML-Datei. 3) Ich arbeite vor Ort und habe Google-Chrome, Firefox und Opera ausprobiert. Alle hatten Registerkarten mit der Aufschrift "Hat nicht funktioniert". Auch wenn ich mich beziehehttp://www.facebook.com in der url klappt es nicht. Bitte hilf mir.
Ich schalte den Alarm ein, um zu sehen, ob der href funktioniert und es funktioniert. Beispiel: Auf der Registerkarte page1 wird "file: ///u/b/user/Desktop/ajaxdemo/Page1.html" zurückgegeben.