App下載

怎么解決boostrapmodal中的閃現(xiàn)問題?案例分享!

重度健忘癥患者 2021-07-30 15:08:26 瀏覽數(shù) (1848)
反饋

對于:“怎么解決boostrapmodal中的閃現(xiàn)問題?”這個問題是之前比較常被問及和搜索到的內(nèi)容,那么今天小編就按照這個問題做了下面這些方面的總結(jié)!

此處閃現(xiàn)場景是,修改和新增用的一個js方法,最終都調(diào)用$('#modalRowEdit').modal('show'); 新增使用的是button,修改使用的a標(biāo)簽。

修改標(biāo)簽:

<a onclick="editRow(this)" data-toggle="modal" data-target="#modalRowEdit">修改</a>
 
// js
function editRow(obj) {
     var colData = dataTable1.row(obj.parentNode.parentNode).data();
     // $('#modalRowEdit').modal('show');  最終調(diào)用該方法顯示modal
     buildForm(colData);
}

新增的標(biāo)簽:

<button class="btn btn-primary pull-right col-sm-1" id="newData">新建</button>
 
// js
$("#newData").on('click', function() {
       // $('#modalRowEdit').modal('show');  最終調(diào)用該方法顯示modal
       buildForm();
});

水平有限,沒注意到a標(biāo)簽直接通過屬性綁定的modal,不需要手動調(diào)用$('#modalRowEdit').modal('show'); 所以出現(xiàn)對話框閃現(xiàn)問題。button則是通過手動調(diào)用方式顯示,所以沒問題。

總結(jié)

以上就是有關(guān)于:“怎么解決boostrapmodal中的閃現(xiàn)問題?”這個問題的相關(guān)內(nèi)容分享,想必在看完這篇文章后都有了不少的了解了吧!當(dāng)然如果你對html5有感興趣的話我們可以在W3Cschool中進(jìn)行全面有體系的學(xué)習(xí)!


0 人點(diǎn)贊