2016-11-08 50 views
0

我已經使用Bootstrap Popover並添加了JS代碼,用於彈出窗口關閉在身體的水龍頭。它適用於Android,但不適用於iOS。Bootstrap:Popover Dismiss無法在iOS瀏覽器中工作

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

 
$('body').on('click', function (e) { 
 
    $('[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 href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 
<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=""> 
 
    Click here 
 
    </a> 
 
</div>

回答

0

得到了答案:

<script> 
$("[data-toggle=popover]") 
.popover({ 
    html: true 
}); 

$('a[data-toggle=popover]') 
.popover(); 

$(':not(#anywhereonthepage)').click(function(e) 

{ 
    e.preventDefault() 

    $('a[data-toggle=popover]').each(function() 

    { 

    if (!$(this).is(e.target) && $(this).has(e.target).length === 0 && $('a[data-toggle=popover]').has(e.target).length === 0) { 
    $(this).popover('hide'); 
    return; 
    } 
    }); 
}); 
</script> 
相關問題