jQuery Глобальные переменные не доступны для функций

Question

У меня есть фрагмент кода, чтобы вычислить ширину некоторых дочерних элементов и вместо объявления parentWidth и других переменных в КАЖДОЙ функции ... Я пытаюсь создать глобальные переменные для повторного использования ... но это не такworking.

Вот часть моего кода:

$(document).ready(function(){

parentWidth = $(this).parent().width();     // parent width in pixels
margin = parentWidth/100;               // pixel equivalent of a 1% margin
border = 6;                 // 6px total border for each input field 


    $(".element.twoinone input").each(function() {
        $(this).css( 'width',
            (((parentWidth - (margin * 2)) - (border * 2))  / 2)
            + 'px' );
    });
});

Переменные parentWidth, margin и border НЕ доступны для функции 'each' (которой я кратен).Я пытался использовать live (), livequery (), .. и т. Д., Но не игра в кости.Я знаю, наверное, что-то простое, что этот нуб пропускает .. поэтому любая помощь очень ценится!Спасибо!Кроме того, если у вас есть какие-либо данные для расчета процентного соотношения ширины на основе ширины родительских контейнеров и учета границы каждого элемента, поля и кол-во, я все уши: D

UPDATE Разве это не так: $ (document) .ready (function () {

parentWidth = $(this).parent().width();     

    $(".element.twoinone input").each(function() {
        $(this).css( 'width',
            (((parentWidth - (margin * 2)) - (border * 2))  / 2)
            + 'px' );
    });
});

То же, что и это:

$ (document) .ready (function () {

    $(".element.twoinone input").each(function() {
        $(this).css( 'width',
            (((     $(this).parent().width()     - (margin * 2)) - (border * 2))  / 2)
            + 'px' );
    });
});

Answer 1

Когда вы объявляете это:

parentWidth = $(this).parent().width();

Вы не получаете ширину родительского элемента этого элемента (<input>), он использует documentдля this, поскольку это контекст, в котором вы находитесь. Вам нужно получить ширину внутри функции, либо внутри каждого, либо в виде плагина, но не «глобально», как это.

Answer 2

Попробуйте поместить переменные вне $(document).ready()

Answer 3

parentWidth не является глобальной переменной, она существует в функции document.ready, но не является глобальной переменной для любой функции.

За исключением случаев, когда вы объявили эту переменную до document.ready:
Примерно так:

var parentWidth;
$(document).ready(function(){
parentWidth = $(this).parent().width();
....

То же самое относится и к двум другим переменным.