在Bootstrap Carousel中禁用的空格键Slide

Question

我在Bootstrap的Carousel幻灯片中有一个窗体。我无法在字段中的文本框中输入空格，并且看不到原因。以下是我的代码：

<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