快捷键/光标

1、快捷键

Button自带属性：accesskey

按Alt + U 或Ctrl+Alt+U触发快捷键

<button id="btn_edit_list" type="button" class="btn btn-primary" accesskey="U">
<span class="fa fa-pencil" aria-hidden="true"></span>@Messages.common_btn_edit
</button>

问题:不论是否打开Modal div,快捷键都会触发（对话框的消失会删除body的modal-open class属性）
修改：一般来说，在一个modal上不能再打开另一个modal。所以，在所有快捷键事件中，增加 body 是否包含 modal-open CSS的判断。

//edit button event
    $("#btn_edit_list").click(function () {
        if ($("body").hasClass('modal-open'))
            return;
        ......
    });

2、光标

设置一打开modal的光标位置：

新规/编辑：光标位置默认在模态框中第一个、可见的、可编辑的、排除只读的控件

扫描二维码关注公众号，回复： 5019974 查看本文章

readonly:只读、可复制

disabled:只读、不可复制

$("#detailModal").on("shown.bs.modal", function () {
$("#actionForm .form-control:visible:enabled:not([readonly]):first").focus();
});

<div class="modal fade" id="detailModal" tabindex="-1" role="dialog" aria-labelledby="editModalLabel" aria-hidden="true">
    <div class="modal-dialog" style="width:650px">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                <h4 class="modal-title" id="editModalLabel"></h4>
            </div>
            <form class="form-horizontal" id="actionForm" method="post" role="form" action='@Url.Action("Save","Abc")'>
                <div class="modal-body">
                    <input type="hidden" id="actionFlag" name="actionFlag" />
                    <input type="hidden" id="index" />
                    @*@Html.Partial("~/Views/Abc/Edit.cshtml")*@

　　　　　　　　.....
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal" accesskey="Q">@Messages.common_btn_close</button>
                    <button type="button" id="btn_editSave" class="btn btn-primary" accesskey="S">@Messages.common_btn_save</button>
                </div>
            </form>
        </div>
    </div>
</div>

猜你喜欢