Question

如果这是一个简单的问题我提前道歉，我有这个javascript代码：

$(document).ready(function() {
    $("#results").hide();

    var html = $.ajax({ url: "ajax.php?db_list=get", async: false}).responseText;

    $("#submit").click(function () { 
        $("#results").show(); 
    });
});

我有一个看起来像这样的按钮：

<fieldset class="action">
        <button name="submit" id="submit">Submit</button>
</fieldset>

当我点击“提交”按钮时，我想显示结果div并将其保留在那里，但是在Chrome中它弹出然后立即消失，这是因为我文档顶部的hide（）函数已准备就绪？

谢谢！

Answer 1

...这是因为我文档顶部的hide（）函数准备好了吗？

可能。我猜这个页面很新鲜。如果您不想这样，请在处理程序中使用return false;。

$("#submit").click(function () { 
    $("#results").show();
    return false; 
});

或event.preventDefault()。

$("#submit").click(function ( event ) { 
    $("#results").show();
    event.preventDefault();
});

Answer 2

最初将结果设置为通过CSS隐藏

/* CSS */
#results {
  display: none;
}

不确定为什么要跳过你应该使用$ .ajax的方式。如果是GET请求，请使用$ .get ...与.live绑定，因为它更好:)。让它是异步的，因为你不希望你的服务器在发生错误时挂起......

$(document).ready(function() {
  $('#submit').live('click', function(){
    $.get('ajax.php?db_list=get', function(data){
      $('#results').html(data);
      $('#results').show();
      return false;
    });
  });
});

Answer 3

而不是提交，请使用此代码

<input id='submitMe' type = 'button' value = 'Submit Me' />

现在你不必返回false; 要么 event.preventDefault（）;在你的JavaScript中

jQuery显示div然后消失

3 个答案: