jQuery UI по выбору - что я делаю не так? - PullRequest
Новая
       29

jQuery UI по выбору - что я делаю не так?

0 голосов
/ 24 ноября 2011

Я знаю, что делаю что-то не так с выбираемым кодом пользовательского интерфейса jQuery, но не могу понять, что именно.Кроме того, как я могу сжать две части выбираемого кода jQuery UI в одну функцию?

Спасибо!

HTML: 

<ul id="monthPicker">
    <li class="month ui-selectable">January</li>
    <li class="month ui-selectable">February</li>
    <li class="month ui-selectable">March</li>
    <li class="month ui-selectable">April</li>
    <li class="month ui-selectable">May</li>
    <li class="month ui-selectable">June</li>
    <li class="month ui-selectable">July</li>
    <li class="month ui-selectable">August</li>
    <li class="month ui-selectable">September</li>
    <li class="month ui-selectable">October</li>
    <li class="month ui-selectable">November</li>
    <li class="month ui-selectable">December</li>
</ul>

jQuery: 

$(document).ready(function() {

    //works
    $('.month').bind('click', function() {
        $(this).toggleClass('picked');
    });

    //doesn't work 
    $('.month').selectable({ 
        selected: function(event, ui) { 
            if($(this).hasClass('picked')){
                $(this).removeClass('picked');
            }                       
            else{
                $(this).addClass('picked');
            }
        }
    });

    //doesn't work
     $('.month').selectable({   
        unselected:function(event, ui) { 
            if($(this).hasClass('picked')){
                $(this).removeClass('picked');
            }                       
            else{
                $(this).addClass('picked');
            }
        }
    });

});

1 Ответ

2 голосов
/ 24 ноября 2011

Вы должны вызывать selectable в родительском элементе, а не в дочерних элементах: 

$('#monthPicker').selectable();

Выбранные элементы затем получают класс ui-selected, когда пользователь выбирает их.

Если вы хотите стилизовать элементы списка (<li> элементов), им присваивается класс ui-selectee.

...