Вызов Javascript на странице после ее загрузки с помощью jQuery GET

StackOverflow https://stackoverflow.com/questions/1704559

  •  19-09-2019
  •  | 
  •  

Вопрос

Представьте себе обычную страницу, вызывающую javscript в head.Проблема в том, что часть контента не загружается до тех пор, пока я не нажму на ссылку.Впоследствии, когда эта ссылка загружает контент, она не будет работать.Это потому, что я предполагаю, что javascript уже был запущен и поэтому не привязывается к тем элементам, которые будут вызваны позже.Вызывается только стандартный html-код.

Так, например, это код, который вызывает мой внешний html.

$.get('content.inc.php', {id:id}, function(data){
        $('#feature').children().fadeTo('fast', 0).parent().slideUp('slow', function(){
           $(this).html(data).slideDown('slow');
        });
    });

Если бы html, который я вызывал, например, и тег H1 уже был на странице, cufon работал бы.Однако, поскольку я загружаю контент с помощью вышеуказанного метода, теги H1 не будут изменены с помощью выбранного мной шрифта.Это только пример.То же самое будет применимо к любому javascript.

Я задавался вопросом, есть ли способ обойти это, не вызывая javascript, а также html, когда он получен из вышеупомянутой функции

Это было полезно?

Решение

Делает Cufon.refresh() делай то, что ты хочешь?

Как вы сказали Cufon был просто пример, я бы также предложил более общий:

$.get(url, options, function(html, status) {
    var dom = $(html);
    // call your function to manipulate the new elements and attach
    // event handlers etc:
    enhance(dom);

    // insert DOM into page and animate:
    dom.hide();
    $target_element.append(dom); // <-- append/prepend/replace whatever.
    dom.show(); // <-- replace with custom animation
});

Другие советы

Если вы хотите прикрепить события к элементам на странице, которые создаются динамически, взгляните на ключевое слово "live".

$('H1').live("click", function() { alert('it works!'); });

Надеюсь, это то, что вы искали.

Вы можете прикрепить обработчики событий к данным, которые вы получаете через get() внутри функции обратного вызова.Например

$.get('content.inc.php', {id:id}, function(data){
    $('#feature').children().fadeTo('fast', 0).parent().slideUp('slow', function(){        
        $(this).html(data).find('a').click(function(e) {
            // specify an event handler for <a> elements in returned data
        }).end().slideDown('slow');
    });
});

live() также может быть вариантом для вас, в зависимости от того, к каким событиям вы хотите привязаться (поскольку live() использует делегирование событий, поддерживаются не все события).

Энди, попробуй это.Он будет вызывать код Cufon после завершения каждого AJAX-запроса и до фактического добавления html-кода на страницу.

$.get('content.inc.php', {id:id}, function(data){
    $('#feature').children().fadeTo('fast', 0).parent().slideUp('slow', function(){
        $(this).html(data);
        Cufon.replace('h1');
        $(this).slideDown('slow');
    });
});

JavaScript не выполняется по соображениям безопасности или потому, что jQuery просто устанавливает для этого элемента innerHTML некоторый текст (который не интерпретируется как JavScript), если он содержится.Таким образом, безопасность - это побочный эффект.

Как это решить?

попробуйте найти все теги скрипта в Вашем ответе и выполнить их как исходные:

var scripts = myelement.getElementsByTagName("SCRIPT");
var i = 0;

for (i = 0; i < scripts.length; i++)
   eval(scripts[i].innerHTML);
Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top