0

嗨,我一直在尝试在这个简单的发送消息中添加延迟()或 setTimeOut,但我想我不太明白这是如何工作的,我一直在“包装”这些功能,但每次我得到很多语法错误,如果我“修复”它们,除了所有动作一个接一个地完成,我什么也没有,即使我设置了延迟(8000),实际上也没有延迟

这是发送消息的脚本

 $.ajax({
      type: "POST",
      url: "sendtofriend.php",
      data: dataString,
      success: function() {
        $('#message').css("display", "none");
        $('#messagein').css("display", "block");
        $('#messagein').html("<div id='messageinin'></div>");
        $('#messageinin').html("<h2><%= t('generales.thankks') %></h2>")
        .append("<p><%= t('generales.msgsent') %>.</p>")

        .fadeIn(1500, function() {
          $('#messagein').append("<img id='checkmark' src='images/check.png' />");
        });

        $('#message').fadeIn(1500, function() {
          $('#messagein').css("display", "none");
         $('#message').css("display", "block");
        });

      }
     });
    return false;
  });


});

我尝试了很多东西,例如这样的东西

  $.ajax({
          type: "POST",
          url: "sendtofriend.php",
          data: dataString,
          success: function() {
            $('#message').css("display", "none");
            $('#messagein').css("display", "block");
            $('#messagein').html("<div id='messageinin'></div>");
            $('#messageinin').html("<h2><%= t('generales.thankks') %></h2>")
            .append("<p><%= t('generales.msgsent') %>.</p>")
            .delay(8000)
            .fadeIn(1500, function() {
              $('#messagein').append("<img id='checkmark' src='images/check.png' />");
            });

            $('#message').fadeIn(1500, function() {
              $('#messagein').css("display", "none");
             $('#message').css("display", "block");
            });

          }
         });
        return false;
      });


    });

我的目标是#message在确认 div '#messagein' 可见时消失,然后消失确认并重新提交表单以提交另一条消息。

这是 HTML

<div id='messagein'></div>
<div id='message'>

<form action="" method="post" id="sendfriendd">


<div id="inpumail" >

   <!-- <input type="text" name="" id="youremailaddress" size="40" value="<%= t('generales.tucorreoo') %>" class="text-input"  />  -->

     <input type="text" name="youremailaddress" id="youremailaddress" size="40" value="<%= t('generales.tucorreoo') %>" class="text-input" onblur="if(this.value == '') { this.style.color='#ccc'; this.value='<%= t('generales.tucorreoo') %>'}" onfocus="if (this.value == '<%= t('generales.tucorreoo') %>') {this.style.color='#000'; this.style.fontStyle='normal'; this.value=''}" style="color: rgb(120, 120, 120); font-style: normal;"/>  
    <label class="error" for="youremailaddress" id="youremailaddress_error">This field is required.</label>  

</div>


<br>
<div id="inpumail2" >


    <input type="text" name="friendsemailaddress" id="friendsemailaddress" size="40" value="<%= t('generales.amigcorreoo') %>" class="text-input" onblur="if(this.value == '') { this.style.color='#ccc'; this.value='<%= t('generales.amigcorreoo') %>'}" onfocus="if (this.value == '<%= t('generales.amigcorreoo') %>') {this.style.color='#000'; this.style.fontStyle='normal'; this.value=''}" style="color: rgb(120, 120, 120); font-style: normal;"/>  
    <label class="error" for="friendsemailaddress" id="friendsemailaddress_error">This field is required.</label>

</div>


<br>
<input type="submit" name="Submit" value=" <%= t('generales.enviarcorreoo') %> " class="enterrenvi">
</form>
4

1 回答 1

1

该函数delay在此示例中不起作用(附加后),因为它只影响 jquery 动画。setTimeout 应该在正确使用时完成这项工作。

尝试消除延迟并更改:

$('#message').fadeIn(1500, function() {
    $('#messagein').css("display", "none");
    $('#message').css("display", "block");
});

进入:

setTimeout(function() {
    $('#message').fadeIn(1000);
    $('#messagein').fadeOut(1000); //animate display none
},5000); //timeout 5 secs
于 2013-09-24T07:30:09.633 回答