我有以下Twitter Bootstrap 3模式,在模态内部有一个表单:
<!-- Button trigger modal -->
<button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">
Launch demo modal
</button>
<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h2 class="modal-title">Add new page</h2>
</div>
<div class="modal-body">
<form class="form-horizontal add-new-page-form">
<fieldset>
<!-- Label -->
<div class="form-group">
<label class="col-md-4 control-label" for="labelInput">Label</label>
<div class="col-md-5">
<input id="labelInput" name="labelInput" type="text" data-field="label" class="form-control input-md">
<span class="help-block">Page label</span>
</div>
</div>
<!-- Button (Double) -->
<div class="form-group"> …Run Code Online (Sandbox Code Playgroud) 为什么这个带有一个文本字段的简单模态对话框(和NO按钮)在焦点位于字段上并且按下Enter时忽略?
<a href="#dlgAddDeviceFolder" class="add-device-folder" data-toggle="modal">New Folder</a>
<div id="dlgAddDeviceFolder" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="dlgAddFolderLabel" aria-hidden="true">
<div class="modal-header">
<!--<a type="button" class="close" data-dismiss="modal" aria-hidden="true">×</a>-->
<h3 id="myModalLabel">Add Device Folder</h3>
</div>
<div class="modal-body">
<form class="form-horizontal">
<div class="control-group">
<label class="control-label" for="dlgAddDeviceFolder_name">Folder Name</label>
<div class="controls">
<input id="dlgAddDeviceFolder_name" type="text" placeholder="Folder Name" autocomplete="off">
</div>
</div>
</form>
</div>
<div class="modal-footer">
<!--<a type="button" class="btn" data-dismiss="modal" aria-hidden="true">Cancel</a>-->
<!--<a id="dlgAddDeviceFolder_btnOk" type="button" class="btn btn-primary">OK</a>-->
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
这里有广泛的讨论,它表明它是一个按钮问题(我在按钮和锚标签上放了type ="button".我已经将按钮标签转换为锚点).但是,我尝试了所有提出的解决方案,最后只是完全注释掉按钮,它仍然会发生.
请注意,如果您只是复制相同的文本输入并有两个字段,则问题就会消失(关注任一文本字段都不会导致Enter解除)