javascript - Bootstrap: Popover dismiss not working in iOS browser -
i have used bootstrap popover , added js code popover dismiss on tap in body. works on android not 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>
got answer:
<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>
Comments
Post a Comment