2014-01-08 46 views
0

我有購物車項目的列表視圖。我希望允許用戶在懸停時增加/減少數量,或者單擊彈出窗口中的每個項目。我已經寫了下面的代碼,但是當我嘗試點擊彈出窗口中的+或 - 符號時彈出框隱藏起來。 在這方面的任何幫助,以及定製CSS的指針,使其通用而無需硬編碼將受到高度讚賞和幫助。 使用自助-3.0.3和jQuery-1.9.1Bootstrap Popover更改數量

$(document).on('click', '.cart-side-view-item-list', function(e) { 
    var item_id=$(this).attr('id'); 
    items_data = window.items_data; 
    items_list = items_data.items_list; 
    var div_content; 
    for(var itm_id in items_list) 
    { 
     temp_id = "cart-side-view-item-" + itm_id 
     if (temp_id === item_id) 
     { 
      div_content = '<div class="sp-quantity"> \ 
          ' + items_list[itm_id].item + ' \ 
          <div class="sp-plus fff"> \ 
          <a class="ddd" href="#" data-multi="1"> \ 
          <i class="glyphicon glyphicon-plus-sign"></i></a></div> \ 
          <div class="sp-input"> \ 
           <input type="text" class="item-quantity" value="'+ items_list[itm_id].quantity +'" /> \ 
          </div> \ 
          <div class="sp-minus fff"> \ 
          <a class="ddd" href="#" data-multi="-1"> \ 
          <i class="glyphicon glyphicon-minus-sign"></i></a></div> \ 
          </div>'; 
     } 

    } 

    editQuantity = function() { 
     var $button = $(this); 
    var $input = $button.closest('.sp-quantity').find("input.item-quantity"); 
    $input.val(function(i, value) { 
     return +value + (1 * +$button.data('multi')); 
    }); 

    }; 

    var $btn2 = $('#'+item_id); 

    $btn2.popover({trigger: 'mannual', 'placement':'left', content: div_content, html:true}) 
     .on('click', (function (e) { 
      var pop_data = $(this).data('popover').tip(); 
      $(pop_data).find('.sp-quantity').on('click', editQuantity); 
     })) 
     .popover('show'); 
}); 
+0

「mannual」的拼寫錯誤導致我的代碼庫上的所有破壞像4小時:(。 – Raja

回答

0

可以防止酥料餅通過停止其click事件傳播,關閉

$btn2.popover({ 
    trigger: 'mannual', 
    'placement': 'left', 
    content: div_content, 
    html: true 
}) 
    .on('click', (function (e) { 
     var pop_data = $(this).data('popover').tip(); 
     $(pop_data).find('.sp-quantity').on('click', editQuantity); 

     e.preventDefault(); 
     e.stopPropagation(); 
     return false; 

    })) 
    .popover('show'); 
+0

這並沒有工作,我也嘗試做e.preventDefault()和e.stopPropogation();以及。 – Raja

0

有一個在代碼中的錯誤seplling引起工作流程的功能與預期不同。對不起。