Space 在 Bootstrap 轮播幻灯片中的表单中禁用了键

Question

我在 Bootstrap 旋转木马幻灯片中有一个表单。我无法在字段的文本框中输入空格，也看不出原因。这是我的代码：

<section class="carousel slide" data-ride="carousel" data-interval="false" data-wrap="false">
  <div class="carousel-inner" role="listbox">
    <div class="item active">
        <form class="form-inline" name="myForm">
            <div class="form-group">
                <input name="title" type="text" class="form-control" /> 
            </div>
            <button type="submit" class="btn btn-success btn-link">Submit</button>
        </form>
    </div>
  </div>

</section>

Answer 1

您可以捕获空格键按键（代码 32）并防止传播到轮播。

$('input').on('keydown', function (e) {
  if (e.keyCode == 32) {
    e.stopPropagation();
  }
});

我还会阻止轮播上的键盘导航，否则使用箭头的人可能会通过轮播幻灯片进行导航。

<section class="carousel slide" data-ride="carousel" data-interval="false" data-wrap="false" data-keyboard="false">

实例：http://www.bootply.com/phVgpOYnO0

Space 在 Bootstrap 轮播幻灯片中的表单中禁用了键

Space Key Disabled in Form in Bootstrap Carousel Slide

forms

carousel

twitter-bootstrap