Вызвать функцию JavaScript на Jquery.load

У меня есть функция JavaScript setErrorImages(), который ищет все img теги и и дает им onerror функция. Это прекрасно работает.

У меня тоже есть подразделение content с динамическим контентом, вызывая де jquery .load функция как это, которая также работает:

$("#content").load("http://example.com/otherpage.php");

Но когда новый контент (otherpage.php) был загружен в раздел, setErrorImages() функция не работает на imgв новом содержании.

Я могу позвонить setErrorImages() функция на otherpage.php, и все работает отлично, но так я должен делать это на каждой другой странице, которых много.

Есть ли способ отправить файл JavaScript или функцию с jquery .load,
или, может быть, есть способ повторно выполнить функцию javascript сразу после jquery .load,

С уважением,
Liontack


function setErrorImages(){
    var images = document.getElementsByTagName("img");
    for (var i = 0; i < images.length; i++) {
        images[i].onerror = function(){ setErrorImage(this); };
    }
}

function setErrorImage(image){
    image.onerror = null;
    image.src = 'http://tanuri.eu/images/error.png';
}

2 ответа

Решение
$("#content").load("http://example.com/otherpage.php", setErrorImages);

.load() принимает "полный" параметр:

Функция обратного вызова, которая выполняется, когда запрос завершается.

Во-первых, я предлагаю использовать this контекст вместо параметра для вашего обработчика ошибок:

function setErrorImage() {
    this.onerror = null;
    this.src = 'http://tanuri.eu/images/error.png';
}

Во-вторых, изменить setErrorImages использовать this тоже:

function setErrorImages() {
    var images = this.getElementsByTagName('img');
    for (var i = 0, n = images.length; i < n; ++i) {
        images[i].onerror = setErrorImage;    // parameter is now implict
    }
}

Обратите внимание, что теперь нет необходимости в обертке функции для onerror вызов - браузер автоматически устанавливает this быть элементом интереса.

Для более простого кода вы также можете просто использовать jQuery, чтобы выполнить эту работу за вас, так как он уже загружен:

function setErrorImages() {
    $('img', this).error(setErrorImage);
}

В-третьих, используйте complete обработчик .load, пользуясь тем, что он устанавливает this быть родителем той части DOM, которая только что была заменена. Это позволяет избежать установки onerror обработчик элементов на странице, на которую вы уже смотрели.

$('#content').load(url, setErrorImages);

Единственное другое изменение - при первом вызове вам нужно будет пройти document в setErrorImages с помощью .call:

setErrorImages.call(document);
Другие вопросы по тегам