1

Bootstrap テンプレートを使用してモーダル ウィンドウにサインアップ フォームを表示する必要があります。

私のサンプルは [R] 要素を押して開く必要がありますが、そうではありません。ただし、例 ( http://www.w3resource.com/twitter-bootstrap/modals-tutorial.php ) ではそうです。

私の例では、属性が正しく機能していないようです:

data-toggle="modal"

なんで?

コード: http://jsfiddle.net/Mfc7M/

<!DOCTYPE html>
<title>Twitter Bootstrap Modals Example</title>
<body>
    <div id="reg-model-dialog" class="modal hide fade in" style="display: none; ">
        <div class="modal-header">  <a class="close" data-dismiss="modal">×</a> 
                <h3>Registration</h3> 
        </div>
        <div class="modal-body">
            <table id="search-tbl">
                <tr>
                    <td>Email:</td>
                    <td>
                        <input type="text" name="reg-email" id="reg-email" />
                    </td>
                </tr>
                <tr>
                    <td>Password:</td>
                    <td>
                        <input type="text" name="reg-pwd" id="reg-pwd" value="" />
                    </td>
                </tr>
            </table>
        </div>
        <div class="modal-footer">  <a href="#" class="btn btn-success">Call to action</a>  <a href="#" class="btn" data-dismiss="modal">Close</a> 
        </div>
    </div>  <a data-toggle="modal" href="#regstration" class="btn btn-primary btn-large" id="reg-dialog-btn">R</a>

$(document).ready(function () {

    //$("#reg-model-dialog").modal();
    /*   $('#reg-dialog-btn').click(function(){
                                                $('#reg-model-dialog').css('display','inline');
                                             }); */

});
4

2 に答える 2