Question

我有一个小提琴here。

当我运行代码时，它启动正常。我输入日期并单击以插入，它出现半秒钟，然后完全消失。

小提琴说**{"error": "Please use POST request"}**，但它在我的浏览器上做了同样的事情。

对此有何想法？

HTML

<h4>Insert Date Here</h4>
<form role="form">  
  <div class="row">
    <div class="col-xs-12">
      <div class="input-group input-group-md">
        <input type="text" class="form-control" placeholder="MM/DD/YYYY"/>
        <div class="input-group-btn">
          <button id="get" class="btn">Insert Date</button>
        </div>
      </div>
    </div>
  </div>
</form> 

<p>
  Nisi odio purus mattis. Habitasse nunc enim cursus cum est aenean nisi, enim odio, ultricies, sit arcu platea, pid, turpis. Parturient, arcu sed tristique? Placerat, <span id='msg'></span> parturient, non ridiculus aenean porttitor mauris amet! Elementum in ridiculus, scelerisque proin, risus, turpis magna dignissim habitasse, dis sed, eros. Ut rhoncus sed, lectus tincidunt.
</p>

的JavaScript

$("#get").click(function () {
    $('#msg').html($('input:text').val());

});

Answer 1

因为您的按钮位于表单内，您需要阻止默认：

$("#get").click(function (e) {
    e.preventDefault();
    $('#msg').html( $('input:text').val());           
});

Answer 2

它消失了，因为你提交了表格。添加它，它将阻止表单提交：

$('form').submit(function(event) {
    event.preventDefault();
});

jsfiddle

为什么在其他地方显示的bootstrap输入会立即消失？

2 个答案: