Question

我知道我在使用jQuery UI可选代码时遇到了问题，但我无法弄明白究竟是什么。另外，我如何将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');
            }
        }
    });

});

Answer 1

你应该在父元素上调用selectable，而不是孩子：

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

当用户选择它们时，所选项目将被赋予课程ui-selected。

如果要设置列表项（<li>元素）的样式，则会为它们提供类ui-selectee。

jQuery UI可选 - 我做错了什么？

1 个答案: