Question

Chrome，Opra和IE都显示第一个提醒，但在点击按钮时不显示任何其他提示。

<div id="contact-container" style='display:none'>
  <div class="sendConfirmation">
    <div class='contact-top'></div>
      <div class='contact-content'>
    <h1 class='contact-title'>Message was sent !</h1>
      </div>
    <div class='contact-bottom'>
      <a href='http://www.i-home.es/'>International Spanish Student Home, Valencia</a>
    </div>

  </div>
</div>

<script type="text/javascript">
alert ("Spot 0");
$("document").ready(function() {    
alert ("Spot 1");
    $('#testbutton').click(function(e) {
        //Cancel the link behavior
        // e.preventDefault();
        alert("Spot 2");
    $('#contact-container').show(5000,function() {alert("is working"); });
    });
    });
</script>

<button id="testbutton" > Click here</button>

Answer 1

以下对指定的HTML不正确：

没有html标签
没有身体标签
没有jQuery脚本包含（也没有头标记）
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

当我添加这些内容时，一切都像魅力一样。

Answer 2

我认为它应该是$（document）.ready而不是$（“document”）。ready

Answer 3

我找到了问题的根源：在HTML中包含jQuery库的位置很重要。

<script type='text/javascript' src='../emailModalForm/js/jquery.js'></script>

我把它放在HTML文档的末尾并且没有工作（至少对于这个测试脚本，它适用于另一个脚本......很奇怪）。一旦我将它移到HTML文件的开头，它就开始工作了。

jQuery就绪功能无法正常工作

3 个答案: