Twitter引導模式顯示，然后消失

Question

我經歷了與Twitter Bootstrap模式有關的所有可能問題，但是我的問題在這里有點獨特。

我已經包含了最新的引導程序發行版中的文件，因此我的公共目錄包含-

css/
| bootstrap.css
| bootstrap.min.css

js/
| bootstrap.js
| bootstrap.min.js

我也在使用Select2，並且我檢查了它是否不干擾引導文件。

我的模態是這樣定義的-

<div class="modal hide fade" id="modal-<?php echo $user_role->id ?>" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
        <h3>Update &ldquo;{{ $user_role->role_name }}&rdquo;</h3>
    </div>
    <div class="modal-body">
        <label>New Value</label>
        <input type="hidden" name="inputId" value="<?php echo $user_role->id ?>">
        <input type="text" name="inputUpdate" value="<?php echo $user_role->role_name ?>" autofocus>
    </div>
    <div class="modal-footer">
        <a href="#" class="btn" data-dismiss="modal" aria-hidden="true">Cancel</a>
        <a rel="update" href="<?php echo url('admin/dashboard/controls/update_master') ?>" class="btn btn-primary">Update</a>
    </div>
</div>

為了調用模式，按鈕的定義如下：

<a rel="edit" data-toggle="modal" href="#modal-<?php echo $user_role->id ?>" class="btn btn-info">Edit</a>

該頁面上運行的JS是-

$(document).ready(function() {
    var urlModal;
    $('a[rel="edit"]').click(function() {
        urlModal = $(this).attr('href');
        $(urlModal).modal();
    });
});

每當我單擊<a rel="edit">按鈕時，模態就會出現並立即消失。

Answer 1

我只是想出了問題。

$('a[rel="edit"]').click(function() {
    urlModal = $(this).attr('href');
    $(urlModal).modal();
});

$(urlModal).modal(); 部分不是必需的。 按鈕的HTML部分中的代碼本身就是模態。 而這個查詢正在關閉它。

現在，它的工作。