jquery выбираемый плагин для выбора дочерних элементов первого уровня, а не дочерних элементов childs - PullRequest
Новая
       16

jquery выбираемый плагин для выбора дочерних элементов первого уровня, а не дочерних элементов childs

0 голосов
/ 23 сентября 2011 
   <ol id="selectable">
    <li class="ui-widget-content">
           <div><input type="checkbox" /></div>
           <div>Item1</div>
           <div>Khanput</div>
           <div>1/2/3</div>
           <div>15:03:16</div>
           <div>--------</div>
           <div>23m</div>
           <div>Chakwal</div>
       </li>
   </ol>

Я просто хочу выбрать элемент 'li', а не 'div', но он выбирает их все. Я попробовал несколько вещей, но они не сработали.

Ответы [ 2 ]

1 голос
/ 23 сентября 2011

Если вы сделаете элемент <li> доступным для выбора, само собой разумеется, что содержимое внутри него также станет «выделенным» при нажатии на <li>.

Что касается пользовательского интерфейса jQuery, то только "1005 *" фактически выбрано. Вы можете видеть это, так как вашему <li> будет присвоен класс ui-selected, когда он выбран; содержимое внутри, наоборот, имеет класс ui-selectee.

0 голосов
/ 11 ноября 2012

Вы можете добавить этот пользовательский плагин 

$.widget("xim.singleSelectable", {
    options: {
        select: null
    },
    _create: function () {
        var self = this;
        this.element.addClass('ui-selectable');
        this.element.delegate('li', 'click', function (e) {
            self.element.find('>li').removeClass('ui-selected');
            $(this).addClass('ui-selected');

            if ($.isFunction(self.options.select)) {
                self.options.select.apply(self.element, [e, this]);
            }

        });
    },
    selected: function () {
        return this.element.find('li.ui-selected');
    },
    destroy: function () {
        $.Widget.prototype.destroy.apply(this, arguments); // default destroy
    }
});

тогда ваш код будет 

$( "#selectable" ).selectable({         
            stop: function() {                
                $( "li.ui-selected", this ).each(function() {
                    var index = $( "#selectable li" ).index( this );                   
                    alert(index);                                       
                });                
            }                        
        });

Я нашел решение здесь Как предотвратить множественный выбор в плагине jQuery UI Selectable

...