ページがモーダルポップアップの上にスクロール

Question

私はブートストラップ（フロントエンド）とcodeigniterを使用してショッピングカートを開発しています。メニューアイテムに追加すると、アイテムの詳細が表示されます。しかし、私の問題はページのスクロールがモーダルポップアップの上に移動することです。

<a href="#" id="edit_product" data-id="<?php echo $lat['product_id'];?>" name="id" data-text="Add To Cart" class="my-cart-b item_add add_to_cart">Add To Cart</a> 

アヤックス

$(".product_add").click(function(event) { 

var currentId = globalId; 


$.ajax({ 
      type: 'POST', 
      url: '<?php echo site_url("ajax_controller1/product_add/'+currentId+'")?>', 
      data: { id:'1' }, 
      success:function(response){ 
       $("#cart_container1").html(response); 
       $("#myModal3").modal('show'); 
    } 
    });/* Aajx */ 



}); 

モーダル

<div class="modal fade" id="myModal3" tabindex="-1" role="dialog" style="overflow: visible;"> 
       <div class="modal-dialog" role="document" style="overflow: visible;"> 
        <div class="modal-content modal-info" style="overflow: visible;"> 
         <div class="modal-header"> 
          <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>       
         </div> 
         <div class="modal-body" id="cart_container1"> 

         </div> 
        </div> 
       </div> 
      </div> 

私はこれが私のデモのウェブサイトのリンク

で、この問題を克服するために、次の

$('a.add_to_cart').click(function(e) { 
    e.preventDefault(); 
}); 

body.modal-open { 
    overflow: visible; 
} 

を行っています0

http://cableandmedia.com/ayurstore/

Answer 1

私は

1. ちょうど削除、犯人はあなたが2つのことを行うことができますどのようなhref="#"

   であると感じhref="#"

2. 変更<a>に `

   <button type="button" id="edit_product" data-id="<?php echo $lat['product_id'];?>" name="id" data-text="Add To Cart" class="my-cart-b item_add add_to_cart">Add To Cart</button>

これはあなたに役立つでしょう。

第2アプローチに従っている場合は、type="button"が追加されています。