Динамически загружать библиотеку JavaScript и вызывать - PullRequest
1 голос
/ 26 января 2020

Попробуйте динамически загрузить библиотеку JavaScript. Ошибка - оповещение не определено. У меня HTML код с библиотеками (оповещение). Я не могу вставить его в iframe

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <script src="https://code.jquery.com/jquery-3.4.1.js"></script>
</head>
<body>

<iframe class="ifr"></iframe>

<script>

    $(document).ready(function () {
        var iframe =
            '<p>Text 1</p>' +
            '<script src="//cdn.jsdelivr.net/npm/alertifyjs@1.13.1/build/alertify.min.js"><\/script>' +
            '<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/alertifyjs@1.13.1/build/css/alertify.min.css"/>' +
            '<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/alertifyjs@1.13.1/build/css/themes/default.min.css"/>' +
            '<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/alertifyjs@1.13.1/build/css/themes/semantic.min.css"/>' +
            '<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/alertifyjs@1.13.1/build/css/themes/bootstrap.min.css"/>' +
            '<p>Text 2</p>' +
            '<script>alertify.success("Success message");<\/script>';

        $(".ifr").contents().find("body").html(iframe);
    });


</script>

</body>
</html>


Образец с jQuery. Ошибка - $ не определено. У меня HTML код с библиотеками (jQuery). Я не могу вставить его в iframe

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <script src="https://code.jquery.com/jquery-3.4.1.js"></script>
</head>
<body>

<iframe class="ifr"></iframe>

<script>

    $(document).ready(function () {
        var iframe =
            '<p>Text 1</p>' +
            '<script src="https://code.jquery.com/jquery-3.4.1.js"><\/script>' +
            '<p>Text 2</p>' +
            '<script>$("p").remove();<\/script>';

        $(".ifr").contents().find("body").html(iframe);
    });


</script>

</body>
</html>


1 Ответ

0 голосов
/ 26 января 2020

это должно сработать, попробуйте загрузить jquery динамически, тогда при вызове onload он может запустить ваш пользовательский код. см. мой пример

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <script src="https://code.jquery.com/jquery-3.4.1.js"></script>
</head>
<body>
<iframe class="ifr"></iframe>
<script>
    $(document).ready(function () {
        var iframe =
            '<p>Text 1</p>' +
            '<script src="https://code.jquery.com/jquery-3.4.1.js"><\/script>' +
            '<p>Text 2</p>' +
            '<script>' +
                'var el = document.createElement("script"); ' +
                'el.src = "https://code.jquery.com/jquery-3.4.1.js"; ' +
                'el.onload = function(){ ' +
                '    $("p").remove();        ' +     
                '}; ' +
                'document.getElementsByTagName("body")[0].append(el);' +
            '<\/script>'
        $(".ifr").contents().find("body").html(iframe);
    });
</script>
</body>
</html>

вот сам скрипт (не закодированный, вам легче понять):

<script>
    var el = document.createElement("script");
    el.src = "https://code.jquery.com/jquery-3.4.1.js";
    el.onload = function(){
        // Put your code here that needs jquery.
        $("p").remove();
    };
    document.getElementsByTagName("body")[0].append(el);
</script>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...