[gelöst] jQuery: Element aus anderer Datei laden (.load)
Moin,
ich möchte aus einer HTML-Datei load.html eine unordered list in meine index.html-Seite laden mit jQuery.load(),leider klappt dies nicht...
load.html
<body>
<ul id="shoppinglist">
<li>Apple</li>
<li>Bananas</li>
</ul>
</body>
index.html
<html>
<body>
</body>
</html>
ist noch leer
und meine jQuery-Anweisung
$(document).ready(function() {
var $loader = $('<div id="shopping" />').load('load.html #shoppinglist');
$loader.appendTo('body');
});
Es wird zwar ein divContainer mit der id="shopping" angelegt", aber die unordered list wird nicht in die index.html geladen.
Die korrekte Verwendungsweise wäre auch
$('body').load('load.html #shoppinglist');
So stehts auch in der JQuery Dokumentation inkl. verschiedenen Beispielen.
Wenn Du ein Div dazu haben willst:
$('body').html('<div id="#shopping"></div>');
$('#shopping').load('load.html #shoppinglist');
Hinweis: ein div ist kein self-closing tag.
- performance is a feature -
Microsoft MVP - @Website - @AzureStuttgart - github.com/BenjaminAbt - Sustainable Code
Versuche es mal ohne '#shoppinglist'. Kannst du später noch auswählen. Verwende relative Pfade : ./load.html. Falls lokal kein Webserver läuft werden es die meisten Browser blocken. Schau in die Konsole (Chrome F12), vielleicht ist es ein "cross origin request". Noch abschließend: $('<div id="shopping"></div>').load ist korrekt.
Danke für eure Antworten.
meine jQuery-Anweisu ng war schon korrekt (Danke für den Hinweise mit dem selfclosing tag) 👍
der Fehler beruht darauf, daß der Browser den Request nicht erlaubt.
Fehlermeldung:
XMLHttpRequest cannot load file:///C:/Users/XXXXX/Desktop/jquery/load.html. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.
benutze ich einen Webserver, dann funktioniert alles wie gewünscht
Jo, der Server denkt, dass es ein XSS Request wäre.
Das ist normal bei lokalen Dateien und jQuery (steht auch glaub ich im Warning von jQuery bei den Ajax-Zugriffen).
Das hättest ruhig sagen dürfen, dass Du mit einer lokalen Datei arbeitest. 👍
- performance is a feature -
Microsoft MVP - @Website - @AzureStuttgart - github.com/BenjaminAbt - Sustainable Code
Das hättest ruhig sagen dürfen, dass Du mit einer lokalen Datei arbeitest. 😮
hätte ich gewußt, dass dies relevant wäre , hätte ich es nicht verschwiegen.
Aber scheinbar geht jeder Browser anders mit dem Request um, FF kann die lokale Datei einbinden, Chrome leider nicht - find ich etwas seltsam ?
Dafür gibt es keinen Standard. Jeder Browser(-Hersteller) hat ein anderes Sicherheitskonzept diesbezüglich.
- performance is a feature -
Microsoft MVP - @Website - @AzureStuttgart - github.com/BenjaminAbt - Sustainable Code