0

我正在设置一个带有单个电子邮件输入表单的启动页面。

现在,当用户输入电子邮件时,表单会迅速淡出,而感谢消息会淡出以替换它。我想做的是让“谢谢”在几秒钟后淡出,然后让表格淡入。

我可以让它发生,只是表单与最初输入的电子邮件一起返回,我花了很多时间试图找出一种用原始占位符文本替换电子邮件地址的方法。

这是来自:

<form action="" method="post" id="sendEmail">
    <div class="forms">
        <div class="buttons" id="buttons">
            <button type="submit" id="submit"></button>
            <input type="hidden" name="submitted" id="submitted" value="true"
            />
        </div>
        <div class="text_box" id="text_box">
            <input type="text" name="emailTo" id="emailTo" value="   Your Email Here"
            onfocus="this.value=''" />
        </div>
    </div>
</form>
<div class="answerBox">
    <div style="display:none;" id="thanks">Thank you!</div>
</div>

这是我用来处理淡入、成功验证后淡出的 Jquery:

if (hasError == false) {
    $.post("adduser1.php", {
        emailTo: emailToVal
    }, function (data) {
        $(".buttons").fadeOut(200);
        $(".text_box").fadeOut(200, function () {
            $("#thanks").fadeIn(200)
        });
    });
}
return false;

我试过这个:

$.post("adduser1.php", {
    emailTo: emailToVal
}, function (data) {
    $(".buttons").fadeOut(200);
    $(".text_box").fadeOut(200, function () {
        $("#emailTo").text("   Your Email Here", function () {
            $("#thanks").fadeIn(200))
        });

但它不起作用。

有任何想法吗?

4

1 回答 1

0

首先#emailTo不受它的影响,.text因为它是一个<input>元素。替换.text.val

$("#emailTo").val("   Your Email Here")

其次,您试图绑定#thanks.fadeIn到 .text(或 .val)更改的末尾。因为它是一个即时动作,所以这是不必要的(我认为也不是正确的 jQuery 语法)。只需放在$("#thanks").fadeIn(200)下一行:

function (data) {
  $(".buttons").fadeOut(200);
  $(".text_box").fadeOut(200, function () {
    $("#emailTo").val("   Your Email Here")
    $("#thanks").fadeIn(200))
  });
}

工作示例:jsFiddle

于 2013-01-27T08:01:38.740 回答