Frage jQuery .load () - Aufruf führt JavaScript in geladener HTML-Datei nicht aus


Dies scheint ein Problem zu sein, das nur mit Safari zu tun hat. Ich habe 4 auf dem Mac und 3 auf Windows versucht und habe immer noch kein Glück.

Ich versuche eine externe HTML-Datei zu laden und das eingebettete JavaScript ausführen zu lassen.

Der Code, den ich versuche zu verwenden, ist dies:

$("#myBtn").click(function() {
    $("#myDiv").load("trackingCode.html");
});

trackingCode.html sieht so aus (einfach jetzt, aber wird einmal erweitert / wenn ich das funktioniere):

<html>
<head>
    <title>Tracking HTML File</title>
    <script language="javascript" type="text/javascript">
        alert("outside the jQuery ready");
        $(function() {
            alert("inside the jQuery ready");
        });
    </script>
</head>

<body>
</body>
</html>

Ich sehe beide Warnmeldungen in IE (6 & 7) und Firefox (2 & 3). Ich bin jedoch nicht in der Lage, die Nachrichten in Safari zu sehen (der letzte Browser, mit dem ich mich befassen muss - Projektanforderungen - bitte keine Flammenkriege).

Irgendwelche Gedanken darüber, warum Safari das JavaScript in der trackingCode.html Datei?

Irgendwann würde ich gerne JavaScript-Objekte an diese übergeben können trackingCode.html Datei, die innerhalb des jQuery-Bereitschaftsanrufs verwendet werden soll, aber ich möchte sicherstellen, dass dies in allen Browsern möglich ist, bevor ich diesen Weg beschreite.


76
2018-05-20 20:07


Ursprung


Antworten:


Sie laden eine komplette HTML-Seite in Ihr div, einschließlich der Tags html, head und body. Was passiert, wenn Sie die Datei laden und nur das Eröffnungs-, das Schließ- und den JavaScript-Code im geladenen HTML-Code haben?

Hier ist die Treiberseite:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"> 
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>jQuery Load of Script</title>
        <script type="text/javascript" src="http://www.google.com/jsapi"></script>
        <script type="text/javascript">
            google.load("jquery", "1.3.2");
        </script>
        <script type="text/javascript">
            $(document).ready(function(){
                $("#myButton").click(function() {
                    $("#myDiv").load("trackingCode.html");
                });
             });
         </script>
    </head>
    <body>
        <button id="myButton">Click Me</button>
        <div id="myDiv"></div>
    </body>
</html>

Hier ist der Inhalt von trackingCode.html:

<script type="text/javascript">
    alert("Outside the jQuery ready");
    $(function() {
        alert("Inside the jQuery ready");
    });
 </script>

Das funktioniert für mich in Safari 4.

Update: DOCTYPE- und HTML-Namespace hinzugefügt, um dem Code in meiner Testumgebung zu entsprechen. Getestet mit Firefox 3.6.13 und Beispielcode funktioniert.


53
2018-05-20 20:10



$("#images").load(location.href+" #images",function(){
    $.getScript("js/productHelper.js"); 
});

35
2017-11-22 21:47



Eine andere Version von John Picks Lösung kurz vorher funktioniert das gut für mich:

jQuery.ajax({
   ....
   success: function(data, textStatus, jqXHR) {
       jQuery(selecteur).html(jqXHR.responseText);
       var reponse = jQuery(jqXHR.responseText);
       var reponseScript = reponse.filter("script");
       jQuery.each(reponseScript, function(idx, val) { eval(val.text); } );
   }
   ...
});

21
2017-09-07 07:11



Ich weiß, dass dies ein etwas älterer Post ist, aber für jeden, der auf diese Seite geht und nach einer ähnlichen Lösung sucht ...

http://api.jquery.com/jQuery.getScript/

jQuery.getScript( url, [ success(data, textStatus) ] )
  • url - Eine Zeichenfolge, die die URL enthält, an die die Anfrage gesendet wird.

  • success(data, textStatus) - Eine Callback-Funktion, die ausgeführt wird, wenn die Anfrage erfolgreich ist.

$.getScript('ajax/test.js', function() {
  alert('Load was performed.');
});

12
2018-02-23 22:07



Dies scheint nicht zu funktionieren, wenn Sie das HTML-Feld in ein dynamisch erstelltes Element laden.

$('body').append('<div id="loader"></div>');
$('#loader').load('htmlwithscript.htm');

Ich schaue auf DOM von Firebug und es gibt überhaupt keinen Skriptknoten, nur den HTML- und meinen CSS-Knoten.

Jeder ist auf das gestoßen?


8
2017-08-31 00:38



Du hast es fast geschafft. Sag jquery, dass nur das Skript geladen werden soll:

$("#myBtn").click(function() {
    $("#myDiv").load("trackingCode.html script");
});

2
2017-08-03 11:38



Testen Sie dies in trackingCode.html:

<script type="text/javascript">

    $(function() {

       show_alert();

       function show_alert() {
           alert("Inside the jQuery ready");
       }

    });
 </script>

2
2017-11-12 15:50



Ich habe versucht, ein jquery-Plugin für HTML-Ladefunktion zu machen. Bitte beachten Sie den folgenden Link.

http://webtech-training.blogspot.in/2010/10/dyamic-html-loader.html

Bitte schlagen Sie mir vor, es mehr zu verbessern.

Vielen Dank, Mohan


2
2018-06-14 03:22