Сценарий jQuery, работающий после загрузки DOM в событии .click? - PullRequest
Новая
       2

Сценарий jQuery, работающий после загрузки DOM в событии .click?

0 голосов
/ 22 октября 2010

Я пытаюсь выяснить, как заставить скрипт jQuery работать правильно, когда запускается событие click, скрипт вычисляет высоту контейнера (этот скрипт появляется в начале страницы при загрузке и работает на 100%)но сейчас я пытаюсь заставить его работать внутри события .click.

Если кто-нибудь знает, как мне этого добиться, я был бы очень благодарен.

ps Я попытался сделать документ готовым;ожидание загрузки DOM, но без сигары. 

$(document).ready(function() {
    $("#hidden4").click(function(event) {
        event.preventDefault();
        $("#hidden4-1").slideToggle();

        var classDown = $('#hidden4 div.down').attr('class');
        var classUp = $('#hidden4 div.up').attr('class');

        if(classDown == 'down') {
            $("#hidden4 div.down").attr("class","up");
        }
        else if(classUp == 'up') {
            $("#hidden4 div.up").attr("class","down"); 
        }
            // Attain the absolute height of the container id container and assign to a usable variable
            var height = $("#container").height();
            alert (height);
            // Use the previous variable, divide by 4 then round that up and multiply by 4 and assign to new variable
            var newHeight = Math.ceil(height / 4) * 4;

            // Create a new variable and add the string "center" to it
            var finalHeight = "center ";

            // Using the previous variable add to it using the first 2 variables subtracting to find the difference and add 2
            finalHeight += (newHeight - height)+2;

            // Using the previous variable add to it the string "px" for the css selector usage
            finalHeight += "px";

            // Update the CSS of the required element altering the background position with the final variable
            $(".contentFooter").css('background-position', finalHeight);
    });
});

Заранее спасибо.

Ответы [ 2 ]

2 голосов
/ 22 октября 2010

Вы вложили готовый () внутрь готового (). Не делай такого. Попробуйте это: 

$(document).ready(function () {
    $("#hidden4").click(function (event) {
        event.preventDefault();
        $("#hidden4-1").slideToggle();

        var classDown = $('#hidden4 div.down').attr('class');
        var classUp = $('#hidden4 div.up').attr('class');

        if (classDown == 'down') {
            $("#hidden4 div.down").attr("class", "up");
        }
        else if (classUp == 'up') {
            $("#hidden4 div.up").attr("class", "down");
        }
        // Attain the absolute height of the container id container and assign to a usable variable
        var height = $("#container").height();
        alert(height);
        // Use the previous variable, divide by 4 then round that up and multiply by 4 and assign to new variable
        var newHeight = Math.ceil(height / 4) * 4;

        // Create a new variable and add the string "center" to it
        var finalHeight = "center ";

        // Using the previous variable add to it using the first 2 variables subtracting to find the difference and add 2
        finalHeight += (newHeight - height) + 2;

        // Using the previous variable add to it the string "px" for the css selector usage
        finalHeight += "px";

        // Update the CSS of the required element altering the background position with the final variable
        $(".contentFooter").css('background-position', finalHeight);
    });
});

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

Обновление: 

$("#foo").slideToggle(function() {
    // this code executes AFTER slideToggle has completed
});
0 голосов
/ 22 октября 2010

Я не думаю, что вам нужно вкладывать другой $ (document) .ready () в щелчок jquery, поскольку DOM уже готов, когда вы применили событие click.

...