Вызов функций JavaScript внутри функций jQuery?

Question

У меня есть две функции JavaScript, которые я хочу вызвать изнутри функции jQuery. Поскольку я загружаю изображения динамически, я хочу проверить ширину каждого изображения, вызвав две функции func1() и func2(), которые будут проверять ширину.

If width < 20px then double width

Я не хочу ждать полной загрузки изображений, а затем выполнить проверку.

Я попробовал это, но не сработало

$(document).ready(function ()
{
    $('img').each(function()
    {
       ....
    })

    func1();
    func2();
})

function func1()
{
   ....
}

function func2()
{
   ....
}

Чего мне не хватает?

Answer 1

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

Вот способ дождаться загрузки изображений:

Официальный способ попросить jQuery дождаться загрузки всех изображений перед выполнением чего-либо

Answer 2

Вы можете изменить это:

$(document).ready(function ()

к этому:

$(window).load(function ()

для обеспечения загрузки всех изображений.

---

Другой вариант - привязать обработчики load к самим изображениям, но могут возникнуть проблемы, если изображения кэшируются.

$('img').load(function() {
    func1();
    func2();
});

Вы должны заметить, что это вызовет функции один раз для каждого изображения , что может означать, что вам нужно будет изменить работу этих функций. Как будто они получают индивидуальное изображение в качестве аргумента.

Answer 3

У меня была проблема, аналогичная вашей проблеме.Я думаю, вы должны переместить свои функции в блок jquery.

$(document).ready(function() {
    function1 () {
       ...       
    }
    function2 () {
       ... 
    }
});

В противном случае, я не думаю, что они могут быть вызваны изнутри jQuery.Проверьте это и сообщите мне о результате.