0

我想要做的是通过淡入和淡出下一个文本和 css 在特定时间内更改 div 的文本和 css。

当表单被提交时，我想在 div 中添加一个类，淡入 css 和新文本“数字成功添加”大约 3 秒，然后淡出该文本并删除 css 并放入旧文本回到它的位置。

我的 div 将包含文本并需要添加一个类

<div id="form_result"></div>

我已经尝试过了，但它不起作用......也许逻辑是错误的。

$('#form_result').html('<h3>Number successfully added!!</h3>').addClass('form_result').fadeIn('fast').delay(1500).fadeOut('fast').removeClass('form_result').html('<h3>Please enter a number:</h3>');
4

3 回答 3

2

试试下面的js。它在 JSfiddle 中运行良好。

在这里演示

HTML

<div id="main_div">
    <span id="form_result"><h3>Please enter a number</h3></span>
</div>
<input type="button" onclick="fade_function();" value="Click" />

JS

function fade_function()
{
    $("#form_result").html("<h3>Number successfully added!!<h3>");
    $('#main_div').animate({opacity: 1.0}, 3000, function(){
        $("#form_result").html("<h3>Please enter a number</h3>");  
    });
}
于 2013-09-23T12:43:02.317 回答
1

请尝试以下代码。

$("form").submit(function () {
    $("#form_result").hide()
    $(this).before("<span class='msg'>Number successfully added!!</span>");
    $('.msg').fadeOut(1500);
    $("#form_result").fadeIn(1500)
});

http://jsfiddle.net/Pkce8/

希望它会有用。

于 2013-09-23T13:20:06.010 回答
0

您是否试图显示其中的内容

<div id="form_result"></div>

背部？

试试这个

于 2013-09-23T12:45:12.003 回答