Angularjs angular modalservice不响应回车键
我使用ui.boostratp和anuglar模态服务创建了以下模态对话框Angularjs angular modalservice不响应回车键,angularjs,ui.bootstrap,Angularjs,Ui.bootstrap,我使用ui.boostratp和anuglar模态服务创建了以下模态对话框 <div id="modalDialog" class="modal-dialog"> <div class="modal-header"> <h2 style="text-align: center">{{modalOptions.headerText}}</h2> </div> <div class="modal
<div id="modalDialog" class="modal-dialog">
<div class="modal-header">
<h2 style="text-align: center">{{modalOptions.headerText}}</h2>
</div>
<div class="modal-body">
<p>{{modalOptions.bodyText}}</p>
</div>
<div class="modal-footer">
<button type="button" class="btn" data-ng-click="modalOptions.close()">{{modalOptions.closeButtonText}}</button>
<button type="button" id="OK" class="btn btn-danger" ng-enter="modalOptions.ok();" autofocus data-ng-click="modalOptions.ok();" data-ng-keyup="$event.keycode == 13 && modaloptions.ok()">{{modalOptions.actionButtonText}}</button>
</div>
</div>
<script type="text/javascript">
$(document).ready(function () {
console.log('Modal Template Loaded');
$('#OK').focus();
$("#modalDialog").keydown(function (event) {
console.log("Event mapped")
if (event.keyCode == 13) {
$(this).parent()
.find("button:eq(0)").trigger("click");
return false;
}
});
}); //document
</script>
{{modalOptions.headerText}
{{modalOptions.bodyText}
{{modalOptions.closeButtonText}
{{modalOptions.actionButtonText}
$(文档).ready(函数(){
log('Modal Template Loaded');
$('#OK')。焦点();
$(“#modalDialog”).keydown(函数(事件){
console.log(“事件映射”)
如果(event.keyCode==13){
$(this.parent())
。查找(“按钮:eq(0)”)。触发(“单击”);
返回false;
}
});
}); //文件
我尝试了多种方法,但都不管用。
对话框加载后,“加载的模式模板”将记录到控制台。
虽然表单使用鼠标工作,但希望它能用于enter键。
如何使其在Enter键下工作?您可以将模态包装在表单标记中,然后使用。请注意,您应该单独使用ng submit,而不使用ng click
另请参见:我发现键事件是在父窗体上捕获的,而不是在对话框中捕获的 因此,我编写了一个JavaScript,从父窗口触发单击,如下所示
document.onkeypress = function (e) {
console.log("key Press " + e.keyCode);
if (e.keyCode == 13)
$("#ModalOKButton").trigger("click");
};
我相信您使用的是这样的东西:,对吗?这很好用,谢谢!。角度模态服务似乎不能很好地处理焦点。