onClick函数只触发一次

时间:2013-08-18 12:14:23

标签: javascript jquery

我已经搜索了一个解决方案或答案,让我接近我的问题的解决方案,没有任何运气。问题是我不知道究竟是什么造成了这种情况。 我有以下HTML结构:

<body>
<div class="showall">
    <div class="comentwrapper" style="height:0; width:800px">

    </div>
    <div class="articol">
        Some article over here !
    </div>
    <input type="button" id="adaugacomentariu" value="Adauga comentariul tau ..." onclick="addBlogComent()" style="float:left; margin-left:5px" /><br /><br />
    <div class="showcomment">
        Coments go over here ..
    </div>
</div>

以及以下JS代码:

function addBlogComent() {
    $('.comentwrapper').animate({"height":"340px"});
    $('.margine').delay(200).fadeIn(400);
}

function hideComent() {
    $('.margine').fadeOut(200);
    $('.comentwrapper').animate({"height":"0px"});
}

$(function() {
    $('#addblogcoment').on('submit', function(e) {
        $('.aratamesaj').fadeIn(300);

        $.post('submitcomentblog.php', $(this).serialize(), function (data) {
            $('.showcoment').load("blogcoment.php");
            $("#addblogcoment").find('input[type=text], textarea').val("");
            $('.aratamesaj').delay(5000).fadeOut(800);
            $('.comentwrapper').delay(2000).fadeOut(200);
        }).error(function() {

        });
        e.preventDefault();
    });
});

我的问题是在.post().load()之后,.onClick=""不再为表单设置动画。

我不明白原因是什么,因为表格和button位于.showall div上,我只是.load() - 某事.showcomment div.showall的孩子。

也许有人能看到我在这里失踪的东西。

有一个小fiddle。没有外部资源,但这不是问题,所有内容都已正确发布和加载。

您可以在MyWebSite看到整个页面。

1 个答案:

答案 0 :(得分:1)

请按照以下方式更改addBlogComent函数代码,您可以设置高度动画,但不能使元素可见。

function addBlogComent(){
$('.comentwrapper').css("display","block").animate({"height":"340px"});
    $('.margine').delay(200).fadeIn(400);
};

在您的成功回调处理程序中,fadeOut正在设置display none。这就是为什么它只工作一次。每次调用你的onclick函数。希望能回答你的问题。

$('.comentwrapper').delay(2000).fadeOut(200);