Question

我正在使用静态网页（使用Twitter Bootstrap轮播示例），并且网页包含表单。我试图将表单放在轮播图像上，但是当我这样做时，用户无法在输入textarea中键入文本。我在笔记本电脑和手机上的Chrome和Safari上测试了这一点，文本框始终没有响应更改。当然好奇，我看了W3 School的旋转木马示例，即便如此，用户输入时文本框中也没有文字。以下是W3Schools的链接，如果您想尝试并查看：

http://www.w3schools.com/bootstrap/tryit.asp?filename=trybs_carousel2&stacked=h

有谁知道可能导致此行为的原因是什么？

我的代码如下：

<div id="myCarousel" class="carousel slide" data-ride="carousel">
  <div class="carousel-inner">
    <div class="carousel-item active">
      <img class="first-slide" src="images/placeholder.jpg">
      <div class="container">
        <div class="carousel-caption">
          <center>

            <h1>Behavioral therapy outside the clinician's office.</h1>
            <p>
              <div class="img-rounded" style="background-color: black; margin-left: 10px; margin-right: 10px;">
                <br>
                <form class="form-inline" role="form" background="black">
                  <div class="form-group">
                    <label for="email">Name:</label>
                    <input type="email" class="form-control" id="name">
                  </div>
                  &nbsp;
                  <div class="form-group">
                    <label for="email">Email:</label>
                    <input type="email" class="form-control" id="email">
                  </div>
                  &nbsp;&nbsp;
                  <button type="submit" class="btn btn-primary">Sign up today</button>
                </form>
                </br>
              </div>

            </p>
          </center>
        </div>
      </div>
    </div>
  </div>
</div>

Answer 1

事实证明问题是使用Bootstrap的版本！我使用的是版本4 alpha版本的Bootstrap，显然仍然是有缺陷的。切换到Bootstrap 3.3.5解决了这个问题。

（感谢brbcoding指出这一点！）

静态网页textarea没有响应Twitter Bootstrap示例上的键盘输入

1 个答案: