在textarea中键入时停止Bootstrap轮播

时间:2014-02-10 21:27:23

标签: javascript jquery html twitter-bootstrap

我不确定这是可能的,但我想是的。

我做了一个带有表格的旋转木马。该表单包含textarea和提交按钮。 到目前为止,如果鼠标指针位于滑块内,则不会滑动。现在很好。但是如果你把指针放在滑块之外,它们会开始滑动。

我想为该textarea应用一些javascript,所以当有人在textarea内部写入时,即使指针位于滑块内部或外部,滑块也会停止。

这是我的滑块:

    <div id="myCarousel" class="carousel slide">
    <!-- Carousel items -->
    <div class="carousel-inner">
    <div class="active item">
    <img src="img/iStock_dogSilverTabby.jpg" />
    <div class="carousel-caption">
    <h1>Licensed Veterinarians ready to answer your questions, 24 hours a day</h1>
    <p> 
    <form method="POST" action="1.php">
    <div class="row">
    <h3 style="padding-left:15px;">What is your question?</h3>
        <div class="col-md-4 col-md-offset-4">

            <textarea class="form-control" id="textareaquestion" name="textareaquestion" style="display: block; margin-left: auto; margin-right: auto;" required></textarea>
            <span class="help-block pull-right" style="color:#fff;">0/250 characters.</span>
        </div>
    </div>
    <button class="btn btn-primary" type="submit">Submit Question</button>
    </form></p>
  </div>
</div>

    <!-- Carousel nav -->
    <a class="carousel-control left" href="#myCarousel" data-slide="prev">&lsaquo;</a>
    <a class="carousel-control right" href="#myCarousel" data-slide="next">&rsaquo;</a>
   </div>

    <!-- LINKED NAV -->
    <ol class="carousel-linked-nav pagination">
    <li class="active"><a href="#1">1</a></li>
    <li><a href="#2">2</a></li>
    <li><a href="#3">3</a></li>
    </ol>

我希望你理解!谢谢你的帮助!我希望这是可能的!

1 个答案:

答案 0 :(得分:0)

Bootstrap有一个方法。您只需要在焦点或单击元素时调用它。类似的东西:

$('input#textareaquestion').click(function() {
    $('#myCarousel').carousel('pause');
});

http://getbootstrap.com/javascript/#carousel