Изменение цвета фона на КАЖДОМ div, когда включено - PullRequest
0 голосов
/ 17 марта 2011

У меня есть список div (div.row), для которого мне нужно обновить цвет фона.В настоящее время я с помощью CSS устанавливаю цвет фона с помощью div.row: nth-child (odd) и div.row: nth: child (even) ..

div.row удаляется с помощью щелчка -и затем это успешно, мне нужно, чтобы обновить всю строку, чтобы он по-прежнему имел различный фон каждую секунду ..

как я могу это сделать?

Мой сценарий сейчас:

<script type="text/javascript">
$(document).ready( function() {
    $("a.delete").click(function(){
        $.ajax({
            type: "POST",
            url: "...",
            data: { this_page_id: $(this).prev().val() },
            success: function(){
                $(".success-delete").css("display","block");
            },
            async: false,
            dataType: "html"
        });
        $("#r" + $(this).prev().val()).slideUp();

        var i = 1
        $("div.row").each( function(index){
            if( i % 2 ){
                $(this).css('background-color','#ffffff');
            } else {
                $(this).css('background-color','#ececec');
            }

            i++;
        });
    });
});
</script>

Ответы [ 4 ]

3 голосов
/ 17 марта 2011

jQuery принимает тонны селекторов:

$('div.row:even').css('background-color', 'white');
$('div.row:odd').css('background-color', '#ececec');

Вот огромный список: http://api.jquery.com/category/selectors/.

0 голосов
/ 17 марта 2011

вот решение .. Наконец-то выяснил: -)

Я пишу в надежде, что это может быть полезно для других - большое спасибо за вашу помощь!

$(document).ready( function() {
    $("a.delete").click(function(){
        var id = $(this).prev().val();
        $.ajax({
            type: "POST",
            url: "/nsautolak.dk/admix/pages/delete/",
            data: { this_page_id: $(this).prev().val() },
            success: function(){
                $(".success-delete").css("display","block");
                $("#r" + id).removeClass("block").slideUp();

                $("div.block:odd").css('background-color','#ececec');
                $("div.block:even").css('background-color','#ffffff');
            },
            async: false,
            dataType: "html"
        });
    });
});
0 голосов
/ 17 марта 2011

Если я правильно понял: если вы удалите одну из строк из середины, вам, возможно, придется перезапустить цикл, чтобы сбросить цвет BG строк.Если удаляемые строки находятся внизу, не нужно ничего делать.

Этот сброс BG строки необходимо выполнить в обработчике события click, где вы обрабатываете удаление строки.

Я быТакже рекомендуем использовать класс CSS вместо прямого стиля.Вы можете использовать .removeClass (), .addClass ()

Надеюсь, это поможет.

0 голосов
/ 17 марта 2011

Это не сработает?

$(document).ready( function() {
    $("a.delete").click(function(){
        $.ajax({
            type: "POST",
            url: "...",
            data: { this_page_id: $(this).prev().val() },
            success: function(){
                $(".success-delete").css("display","block");
                doRows();
            },
            dataType: "html"
        });
        $("#r" + $(this).prev().val()).slideUp();

        function doRows() {
            $("div.row").each( function(index){
                if( index % 2 ){
                    $(this).css('background-color','#ffffff');
                } else {
                    $(this).css('background-color','#ececec');
                };
            });
        };

        doRows();
    });
});
...