Question

在我的表单中，我会在点击后隐藏提交按钮，并显示一个显示submitting...的div。

这是非常基本的。见jsfiddle。

jQuery代码是：

jQuery("#subnewtopicform").submit(function(e) {

    // Hide button by button ID
    jQuery("#subnewtopic").hide();

    // Show hidden div
    jQuery("#submitted").show();
});

和HTML：

<form action="" method="post" id="subnewtopicform" />           
  Title:
 <input type="text" name="title" /><br/>
 <input type="submit" value="Submit Topic" class="button-primary" name="subnewtopic" id="subnewtopic" /> 
</form>

<div id="submitted" style="display:none">Submitting...</div>

我的问题是，如何才能让它在20秒后再次显示#subnewtopic并隐藏#subnewtopic（回到最初的原因）？

Answer 1

您可以使用setTimeout来实现此目的 http://jsfiddle.net/soyn0xag/47/

 setTimeout(function() {
    jQuery("#subnewtopic").show();
    jQuery("#submitted").hide();
 },20000);

完整的javascript可能是：

jQuery("#subnewtopicform").submit(function(e) {

    // Hide button by button ID
    jQuery("#subnewtopic").hide();

    // Show hidden div
    jQuery("#submitted").show();

    setTimeout(function() {
       jQuery("#subnewtopic").show();
       jQuery("#submitted").hide();
    },20000);

});

Answer 2

您可以使用setTimeout在设置的延迟后运行代码块：

$("#subnewtopicform").submit(function (e) {
    $("#subnewtopic").hide();
    $("#submitted").show();

    setTimeout(function() {    
        $("#subnewtopic").show();
        $("#submitted").hide();
    }, 20000); 
});

Example fiddle

显示/隐藏div一段时间

2 个答案: