Rumah >hujung hadapan web >tutorial js >Penggunaan mudah kemahiran dialog_javascript modal Bootstrap
Modal ialah subborang yang meliputi borang induk. Biasanya, tujuannya adalah untuk memaparkan kandungan daripada sumber berasingan yang boleh mempunyai beberapa interaksi tanpa meninggalkan borang induk. Subborang menyediakan maklumat, interaksi dan banyak lagi.
Jika anda ingin merujuk kefungsian pemalam ini secara berasingan, maka anda perlu merujuk modal.js. Sebagai alternatif, seperti yang dinyatakan dalam bab gambaran keseluruhan pemalam Bootstrap, anda boleh merujuk bootstrap.js atau versi mini bootstrap.min.js.
1. Penggunaan
Anda boleh menukar kandungan tersembunyi pemalam modal:
Melalui atribut data: Tetapkan atribut data-toggle="modal" pada elemen pengawal (seperti butang atau pautan), dan tetapkan data-target="#identifier" atau href="#identifier" untuk menentukan mod tertentu untuk ditukar kotak status (dengan id="pengenal").
Melalui JavaScript: Menggunakan teknik ini, anda boleh memanggil modal dengan id="identifier" dengan baris JavaScript yang ringkas:
$('#pengecam').modal(pilihan)
2. Contoh mudah
div id="myModal" class="modal hide fade"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal">x</button> <h3>对话框标题</h3> </div> <div class="modal-body"> <p>对话框主体</p> </div> <div class="modal-footer"> <a href="#" class="btn" data-dismiss="modal">取消</a> <a href="#" class="btn btn-primary" data-dismiss="modal">确定</a> </div> </div>
Dialog modal boleh dipanggil terus menggunakan butang atau pautan, berikut ialah penggunaan mudah:
Di atas adalah keseluruhan kandungan artikel ini, saya harap ia akan membantu kajian semua orang.