BootStrap自定義popover,點(diǎn)擊區(qū)域隱藏功能的實(shí)現(xiàn)
當(dāng)用bootstrap時(shí),經(jīng)常需要在某個(gè)地方添加幫助按鈕,點(diǎn)擊或者鼠標(biāo)懸浮時(shí),提示幫助信息,然而,bt給我們提供的方法里貌似沒有,如果有哪位大神知道bootstrap有的可以留言,小弟學(xué)習(xí)了:代碼如下
之前的按鈕必須定義class為pop;
$(function(){ $(".pop").popover({placement:'right', trigger:'manual', delay: {show: 10, hide: 10}, html: true, title: function () { return $("#data-original-title").html(); }, content: function () { return $("#data-content").html(); // 把content變成html }}); $('body').click(function (event) { var target = $(event.target); // 判斷自己當(dāng)前點(diǎn)擊的內(nèi)容 if (!target.hasClass('popover') && !target.hasClass('pop') && !target.hasClass('popover-content') && !target.hasClass('popover-title') && !target.hasClass('arrow')) { $('.pop').popover('hide'); // 當(dāng)點(diǎn)擊body的非彈出框相關(guān)的內(nèi)容的時(shí)候,關(guān)閉所有popover } }); $(".pop").click(function (event) { $('.pop').popover('hide'); // 當(dāng)點(diǎn)擊一個(gè)按鈕的時(shí)候把其他的所有內(nèi)容先關(guān)閉。 $(this).popover('toggle'); // 然后只把自己打開。 }); });
--------代碼非原創(chuàng),借鑒網(wǎng)上大神,純粹自己學(xué)習(xí)記錄而已,勿噴!
以上這篇BootStrap自定義popover,點(diǎn)擊區(qū)域隱藏功能的實(shí)現(xiàn)就是小編分享給大家的全部?jī)?nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
相關(guān)文章
JavaScript讀二進(jìn)制文件并用ajax傳輸二進(jìn)制流的方法
這篇文章主要介紹了JavaScript讀二進(jìn)制文件并用ajax傳輸二進(jìn)制流的方法的相關(guān)資料,需要的朋友可以參考下2016-07-07Bootstrap框架的學(xué)習(xí)教程詳解(二)
Bootstrap,來自 Twitter,是目前最受歡迎的前端框架。本文給大家介紹Bootstrap框架的學(xué)習(xí)教程詳解,對(duì)bootstrap框架感興趣的朋友跟著小編一起學(xué)習(xí)吧2016-10-10JavaScript建立一個(gè)語(yǔ)法高亮輸入框?qū)崿F(xiàn)思路
通常網(wǎng)站自帶的textarea編輯器不能滿足我們的需求比如高亮顯示代碼等,在這篇文章中,我將使用JavaScript庫(kù)ACE來創(chuàng)建一個(gè)輸入框效果,該腳本允許開發(fā)人員創(chuàng)建支持語(yǔ)法高亮的輸入框,感興趣的你可不要錯(cuò)過了哈2013-02-02uniapp中使用render.js進(jìn)行openlayers、arcgis等地圖操作實(shí)戰(zhàn)指南
renderjs是一個(gè)運(yùn)行在視圖層的js,它比WXS更加強(qiáng)大,它只支持app-vue和h5,下面這篇文章主要給大家介紹了關(guān)于uniapp中使用render.js進(jìn)行openlayers、arcgis等地圖操作的相關(guān)資料,需要的朋友可以參考下2024-01-01JS中的==運(yùn)算: [''''] == false —>true
這篇文章主要介紹了JS中的==運(yùn)算: [''] == false —>true的相關(guān)資料,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友可以參考下2016-07-07實(shí)例詳解JSON取值(key是中文或者數(shù)字)方式
本文通過實(shí)例詳解JSON取值(key是中文或者數(shù)字)方式,非常不錯(cuò),具有參考借鑒價(jià)值,需要的的朋友參考下吧2017-08-08