Jquery .load () - Как выполнить Javascript в оригинальном документе из загруженного содержимого - PullRequest
Новая
       3

Jquery .load () - Как выполнить Javascript в оригинальном документе из загруженного содержимого

3 голосов
/ 19 января 2012

У меня есть документ, который загружает некоторый контент в div с помощью функции JQuery .load ().Этот загруженный контент затем пытается выполнить Javascript из исходного документа.Это не удается, возможно, по очевидным причинам (я новичок в Javascript).Вот упрощенный код, который иллюстрирует мою проблему.

test.html: 

<html>
<head>
    <script src="http://code.jquery.com/jquery-latest.min.js"></script>
    <style type="text/css">
    div {
        background: #ccc;
        margin: 15px;
        height: 500px;
        width: 500px;
        border: 1px solid #666;
    }
    </style>
</head>
<body>
    <a href="#" class="loader">Load content into box below</a>
    <div id="loadbox"></div>
    <script type="text/javascript"> 

        jQuery(document).ready(function() { 

            $('a.loader').click(function() {
                $('#loadbox').load('loadme.html');
            });

            $('a.alerter').click(function() {
                alert("I've been clicked!");
            });

        });
    </script>
</body>
</html>

loadme.html: 

<a href="#" class="alerter">Click me</a> for an alert.

Предупреждение включается, если я помещаю JavaScriptв загруженном контенте, но у меня есть большой блок Javascript, который я хочу использовать с более чем одним div, полным загруженного контента, и я не хочу продолжать загружать Javascript.Есть ли способ получить доступ к Javascript в исходном HTML из загруженного контента?У меня нет четкого понимания того, в каком порядке выполняются вещи, особенно когда я загружаю контент на страницу.Может быть, это моя возможность учиться!Спасибо.

Ответы [ 3 ]

4 голосов
/ 19 января 2012

DВы должны использовать live () или делегат () , поскольку вы добавляете элемент в документ (для jQuery <1.7) </p> 

   jQuery(document).ready(function() { 

        $('a.loader').click(function() {
            $('#loadbox').load('loadme.html');
        });

        $('a.alerter').live("click", function() {
            alert("I've been clicked!");
        });

    });

для jQuery> 1,7 вы должны использовать on () и делегировать обработчик в тело 

   jQuery(document).ready(function() { 

        $('a.loader').click(function() {
            $('#loadbox').load('loadme.html');
        });

        $('body').on("click", "a.alerter", function() {
            alert("I've been clicked!");
        });

    });
2 голосов
/ 19 января 2012

Потому что загрузки домена нет и скрипт не может ее найти;Пожалуйста, попробуйте: 

jQuery(document).ready(function () {
    $('a.loader').click(function () {
        $('#loadbox').load('loadme.html', function () {
            $('a.alerter').click(function () {
                alert("I've been clicked!");
            });
        });
    });
});
1 голос
/ 19 января 2012

Заменить 

$('a.alerter').click(function() {
    alert("I've been clicked!");
});

С 

$("#loadbox").delegate( "a.alerter", "click", function() {
    alert("I've been clicked!");
});

Это делегирует событие #loadbox, которое существует, поэтому оно будет работать, пока существует #loadbox.

...