2
我有一個jQuery的listview和下面的代碼，將其改爲手風琴。在<li>之內，我有一個名爲「ui-li-accordion」的div，它隱藏了內容，然後點擊顯示。jQuery移動手風琴
我遇到的問題是我想在div中放置下拉菜單，但是當我單擊下拉菜單時，div會再次滑動。
我需要的是，如果div中的任何位置被點擊，則不會進行滑動操作。除此之外。
/*
* jQuery Mobile Framework : listview accordion extension
* Copyright (c) Boris Smus, Christopher Liu
* Note: Code is in draft form and is subject to change
*/
(function($, undefined) {
$("[data-role='listview']").live("listviewcreate", function() {
var list = $(this),
listview = list.data("listview");
var accordionExpandOne = function(accordion) {
// Close all other accordion flaps
list.find('.ui-li-accordion').slideUp();
// Open this flap
accordion.slideToggle();
}
var accordionDecorator = function() {
list.find('.ui-li-accordion').each(function(index, accordion) {
// Format the accordion accordingly:
// <li>...normal stuff in a jQM li
// <div class="ui-li-accordion">...contents of this</div>
// </li>
// If we find an accordion element, make the li action be to open the accordion element
// console.log('accordion found ' + accordion);
// Get the li
var $accordion = $(accordion);
$li = $accordion.closest('li');
// Move the contents of the accordion element to the end of the <li>
$li.append($accordion.clone());
$accordion.remove();
// Unbind all click events
$li.unbind('click');
// Remove all a elements
$li.find('a').remove();
// Bind click handler to show the accordion
$li.bind('click', function() {
var $accordion = $(this).find('.ui-li-accordion');
// Check that the current flap isn't already open
if ($accordion.hasClass('ui-li-accordion-open')) {
$accordion.slideUp();
$accordion.removeClass('ui-li-accordion-open');
return;
}
console.log('continue');
// If not, clear old classes
list.find('.ui-li-accordion-open').removeClass('ui-li-accordion-open');
$accordion.toggleClass('ui-li-accordion-open');
accordionExpandOne($accordion);
});
});
};
var accordionExpandInitial = function() {
//Expand anything already marked with -open.
accordionExpandOne(list.find('.ui-li-accordion-open'));
};
accordionDecorator();
accordionExpandInitial();
// Make sure that the decorator gets called on listview refresh too
var orig = listview.refresh;
listview.refresh = function() {
orig.apply(listview, arguments[0]);
accordionDecorator();
};
});
})(jQuery);