简体   繁体   English

onClick函数仅触发一次

[英]onClick function only trigger once

I've searched a solution or an answer to get me close to the solution for my problem, without any luck. 我一直在寻找解决方案或答案,以使自己更接近问题的解决方案,而没有任何运气。 The problem is that I don't know what is actually causing this. 问题是我不知道到底是什么原因造成的。 I have the following HTML sructure : 我有以下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>

and the follwing JS code : 和下面的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();
    });
});

My problem is that after .post() and the .load() that .onClick="" is not animating the form anymore. 我的问题是,在.post().onClick="" .load().onClick=""不再对表单进行动画处理。

I don't understand what can be the cause, because the form and the button is on the .showall div and I'm only .load() -ing something in .showcomment div which is a child of .showall . 我不知道是什么原因造成的,因为表单和button.showall div而我只是.load() . .showcomment div中的某个东西,它是.showall的子.showall

Maybe someone can see something I'm missing over here . 也许有人可以看到我在这里想念的东西。

There is a small fiddle . 有个小提琴 Don't have the external resources, but that is not the problem, everything is posted and loaded properly. 没有外部资源,但这不是问题,所有内容都已正确发布和加载。

You can see the whole page at MyWebSite . 您可以在MyWebSite上看到整个页面。

Please change your addBlogComent function code as follows, you are animating height but not making element visible. 请按如下所示更改addBlogComent函数代码,您正在设置高度动画,但不使元素可见。

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

Within your success callback handler fadeOut is setting display none. 在成功的回调处理程序中,fadeOut设置为不显示。 That is why its only working once. 这就是为什么它只能工作一次的原因。 Your onclick function is being called each time. 每次都会调用您的onclick函数。 Hope that answer your question. 希望能回答您的问题。

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

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM