我有一个使用.on()的脚本,因为元素是动态生成的,在某些移动设备上不起作用。您可以尝试lilwhats.com/demo。请使用此网站进行测试:https://www.browserling.com/ 选择旧版本的android,也可以选择windows vista>internet explorer v9
restaurant.php
($allow_order
? '<div class="add-menu">
<div class="add-btn add-item-to-order">
<span>' . $lang['ADD'] . '</span>
<i class="icon-feather-plus"></i>
</div>
' .
(!empty($extras) ? '<span class="customize">' . $lang['CUSTOMIZABLE'] . '</span>' : '')
. ' </div>'
: '') .
'
theme.js
// add menu to order
$(document).on('click','.add-item-to-order', function (e) {
e.preventDefault();
var $add_customize = $('<div class="add-btn add-item-btn">' +
'<div class="wrapper h-100">' +
'<div class="addition menu-order-quantity-decrease">' +
'<i class="icon-feather-minus"></i>' +
'</div>' +
'<div class="count">' +
'<span class="num menu-order-quantity">1</span>' +
'</div>' +
'<div class="addition menu-order-quantity-increase">' +
'<i class="icon-feather-plus"></i>' +
'</div>' +
'</div>' +
'</div>'),
$item = $(this).closest('.section-menu'),
item_id = $item.data('id'),
name = $item.data('name'),
description = $item.data('description'),
price = $item.data('price'),
amount = $item.data('amount'),
order_price = Number(amount),
extras = TOTAL_MENUS[$item.data('id')].extras || [],
order_data = JSON.parse(localStorage.getItem('quickqr_order')),
random_id = randomId(10);
$item.data('cart_id',random_id);
if(extras.length == 0){
order_data[random_id] = {
'id': item_id,
'item_name': name,
'item_price': amount,
'extras': {},
'quantity': 1
};
localStorage.setItem('quickqr_order', JSON.stringify(order_data));
$item.find('.add-menu').html($add_customize);
} else {
$menuCustomize.find('h4').html(name);
$menuCustomize.find('.customize-item-description').html(description);
$('#order-price').html(formatPrice(amount));
$('#menu-order-quantity').text(1);
var $extra_wrapper = $('#customize-extras');
$extra_wrapper.html('');
for (var i in extras) {
if (extras.hasOwnProperty(i)) {
var $extra_tpl = $(
'<div class="extras menu-extra-item">' +
'<span class="extra-item-title"></span>' +
'<div class="d-flex align-items-center">' +
'<span class="mr-2 extra-item-price"></span>' +
'<div class="custom-control custom-checkbox mr-sm-2">' +
'<input type="checkbox" class="custom-control-input" id="customControl">' +
'<label class="custom-control-label" for="customControl"></label>' +
'</div>' +
'</div>' +
'</div>');
$extra_tpl.find('.custom-control-input').attr('id', 'checkbox' + extras[i].id);
$extra_tpl.find('label').attr('for', 'checkbox' + extras[i].id);
$extra_tpl.find('.extra-item-title').html(extras[i].title);
$extra_tpl.find('.extra-item-price').html(formatPrice(extras[i].price));
$extra_tpl.data('price', extras[i].price);
$extra_tpl.data('id', extras[i].id);
$extra_tpl.find('.custom-control-input').on('change',function () {
$('#menu-order-quantity').text(1);
calculateOrderPrice(amount);
});
$extra_wrapper.append($extra_tpl);
}
}
$menuCustomize.find('.menu-order-quantity-decrease').off().on('click', function (e) {
e.stopPropagation();
var quatity = Number($('#menu-order-quantity').text()) - 1;
if(quatity == 0){
quatity = 1;
}
$('#menu-order-quantity').text(quatity);
calculateOrderPrice(order_price);
});
$menuCustomize.find('.menu-order-quantity-increase').off().on('click', function (e) {
e.stopPropagation();
$('#menu-order-quantity').text(Number($('#menu-order-quantity').text()) + 1);
calculateOrderPrice(order_price);
});
$('#add-order-button').off().on('click', function (e) {
calculateOrderPrice(order_price);
var price = $('#order-price').html();
var order_data = JSON.parse(localStorage.getItem('quickqr_order'));
// this order's extras
var extras = {};
$('.menu-extra-item').each(function () {
if($(this).find('.custom-control-input').is(':checked')){
extras[randomId(10)] = {
'id': $(this).data('id'),
'name': $(this).find('.extra-item-title').html(),
'price': $(this).data('price')
};
}
});
order_data[random_id] = {
'id': item_id,
'item_name': name,
'item_price': amount,
'extras': extras,
'quantity': $('#menu-order-quantity').text()
};
localStorage.setItem('quickqr_order', JSON.stringify(order_data));
$add_customize.find('.menu-order-quantity').text($('#menu-order-quantity').text());
$item.find('.add-menu').html($add_customize);
manageViewOrder();
$('.overlay').trigger('click');
});
$menuCustomize.addClass('active');
$('.overlay').addClass('active');
$('body').addClass('noscroll');
}
manageViewOrder();
});
我真的很感谢你的帮助
$order_tpl.find('.menu-order-quantity-decrease').off().on('click', function (e) {
e.stopPropagation();
var $item = $(this).closest('.section-menu');
var $quantity = $item.find('.menu-order-quantity');
var quantity = Number($quantity.text()) - 1;
var cart_key = $item.data('cart_id');
var $menu_item = $('.section-menu[data-id="' + order_data[cart_key]['id'] + '"]');
if (quantity == 0) {
var $add_btn = $('<div class="add-btn add-item-to-order">' +
'<span>' + LANG_ADD + '</span>' +
'<i class="icon-feather-plus"></i>' +
'</div>');
$menu_item.find('.add-menu').html($add_btn);
delete order_data[cart_key];
} else {
$menu_item.find('.menu-order-quantity').text(quantity);
order_data[cart_key]['quantity'] = quantity;
}
localStorage.setItem('quickqr_order', JSON.stringify(order_data));
generateViewOrder();
});
1条答案
按热度按时间hs1rzwqc1#
手机或平板电脑上没有鼠标,因此请尝试向处理程序添加事件