2016-11-22 8 views
0

表示ポップオーバー用の「ボタン1」と外部リンク用の「ボタン2」の2つのボタンがあります。 iPhoneで動作しないブートストラップポップオーバー解除機能

$(document).ready(function() { 
 
     $("body").tooltip({ 
 
      selector: "a[data-toggle='tooltip']", 
 
      container: "body" 
 
     }) 
 
       .popover({ 
 
        selector: "a[data-toggle='popover']", 
 
        container: "body", 
 
        html: true 
 
       }); 
 
    }); 
 

 
    $('body').on('click', function (e) { 
 
     $('a[data-toggle="popover"]').each(function() { 
 
      if(!$(this).is(e.target) && 
 
        $(this).has(e.target).length === 0 && 
 
        $('.popover').has(e.target).length === 0) { 
 
       $(this).popover('hide'); 
 
      } 
 
     }); 
 
    });
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 

 
<div class="container" style="width:400px; height:400px; background:#000;padding-top:50px;"> 
 
    <a data-placement="top" role="button" class="btn btn-danger" data-toggle="popover" data-content="Popover" data-original-title="" title=""> Button1 </a> 
 
    <a class="btn btn-danger" href="http://facebook.com" target="_blank">Button2</a> </div>

(それはiphoneで同じボタン上の場合にのみ、タップを閉じ)私たちは身体上の任意の場所をタップしたときにポップオーバーを閉じますが、そのがiPhone上で動作していないに「ボタン1」のためのいくつかのカスタマイズされたjQueryのを追加しました

答えて

0

"body"タグはiphoneで動作しません。bodyにクラスを追加しました。今すぐ仕事:

$(document).ready(function() { 
     $("body").tooltip({ 
      selector: "a[data-toggle='tooltip']", 
      container: "body" 
     }) 
       .popover({ 
        selector: "a[data-toggle='popover']", 
        container: "body", 
        html: true 
       }); 
    }); 

    $('.bodyClass').on('click', function (e) { 
     $('a[data-toggle="popover"]').each(function() { 
      if(!$(this).is(e.target) && 
        $(this).has(e.target).length === 0 && 
        $('.popover').has(e.target).length === 0) { 
       $(this).popover('hide'); 
      } 
     }); 
    }); 
関連する問題