在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