Penyelesaian kepada masalah bahawa kotak pop timbul Bootstrap tidak boleh dipanggil_kemahiran javascript

WBOY
Lepaskan: 2016-05-16 15:11:16
asal
1526 orang telah melayarinya

Penerangan Masalah

Bootstrap rangka kerja bahagian hadapan digunakan dalam menulis projek, dan fungsi yang disediakan sangat berkuasa!

pembelajaran bootstrap

Namun, apabila menggunakan komponen kotak timbul yang disediakan oleh bootstrap, kotak timbul tidak boleh timbul!

Secara logiknya sepatutnya begini:

Contoh rasmi ditulis seperti ini:

<!DOCTYPE html>
<html>
<head>
<title>Bootstrap 实例 - 弹出框(Popover)插件</title>
<link href="http://libs.baidu.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script src="http://libs.baidu.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container" style="padding: 100px 50px 10px;" >
<button type="button" class="btn btn-default" title="Popover title" 
data-container="body" data-toggle="popover" data-placement="left" 
data-content="左侧的 Popover 中的一些内容">
左侧的 Popover
</button>
<button type="button" class="btn btn-primary" title="Popover title" 
data-container="body" data-toggle="popover" data-placement="top" 
data-content="顶部的 Popover 中的一些内容">
顶部的 Popover
</button>
<button type="button" class="btn btn-success" title="Popover title" 
data-container="body" data-toggle="popover" data-placement="bottom" 
data-content="底部的 Popover 中的一些内容">
底部的 Popover
</button>
<button type="button" class="btn btn-warning" title="Popover title" 
data-container="body" data-toggle="popover" data-placement="right" 
data-content="右侧的 Popover 中的一些内容">
右侧的 Popover
</button>
</div>
<script>$(function () 
{ $("[data-toggle='popover']").popover();
});
</script>
</div>
</body>
</html>
Salin selepas log masuk

Kod telah diperiksa tiga kali Selepas mengesahkan bahawa kod itu betul, masukkan nyahpepijat Firefox,

<script>
$(function () 
{ 
$("[data-toggle='popover']").popover(); 
});
</script>
Salin selepas log masuk

Sekeping kod ini adalah global dan akan diaktifkan sebaik sahaja anda memasuki halaman, melompat terus ke dalam rangka kerja js bootstrap:

Penyelesaian kepada masalah bahawa kotak pop timbul Bootstrap tidak boleh dipanggil_kemahiran javascript

Ia sebenarnya mengatakan bahawa saya tidak mengimport jquery! Tetapi saya dengan jelas memperkenalkannya!

<link rel="stylesheet" href="css/bootstrap.min.css"/>
<script type="text/javascript" src="js/bootstrap.min.js" ></script>
<script type="text/javascript" src="js/jquery.min.js" ></script>
Salin selepas log masuk

Terencat? . . . . . .

Kemudian saya memikirkannya, bootstrap bergantung pada jquery, jadi saya melaraskan susunan rujukan dengan mentaliti mencubanya:

<script type="text/javascript" src="js/jquery.min.js" ></script>
<script type="text/javascript" src="js/bootstrap.min.js" ></script>
Salin selepas log masuk

Melalui kandungan di atas, masalah kotak timbul Bootstrap tidak dapat dipanggil telah berjaya diselesaikan Rakan-rakan yang menghadapi masalah dengan kotak timbul bootstrap boleh merujuk tutorial ini.

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan
Tentang kita Penafian Sitemap
Laman web PHP Cina:Latihan PHP dalam talian kebajikan awam,Bantu pelajar PHP berkembang dengan cepat!