2013-08-18 5 views
1

Я искал решение или ответ, чтобы получить меня близко к решению для моей проблемы, без везения. Проблема в том, что я не знаю, что на самом деле вызывает это. У меня есть следующий HTML sructure:onClick функция только триггер один раз

<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> 

и follwing код 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 находится на .showalldiv и я только .load() -ную что-то в .showcommentdiv, который является дочерним .showall.

Возможно, кто-то может увидеть что-то, что мне не хватает здесь.

Существует небольшой fiddle. У вас нет внешних ресурсов, но это не проблема, все загружается и загружается должным образом.

Вы можете увидеть полную страницу по MyWebSite.

+2

Привет, Люциан, чтобы помочь в кодировании и обслуживании в последующие годы, комментарий имеет значение с мм, а маржа не имеет e. Надеюсь, ты не против меня, указывая на это. –

+0

и еще одно замечание: ваше несогласованное отступы заставили меня активно отсканировать проблемы в этом отношении, функции завершения с половиной двоеточия, такие как утверждения, еще больше отбросили меня. –

ответ

1

Пожалуйста, измените свой код функции addBlogComent следующим образом: вы анимируете высоту, но не видите элемент видимым.

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

В пределах вашего успешного обработчика обратного вызова fadeOut устанавливается отображение нет. Вот почему он работает только один раз. Каждый раз вызывается функция onclick. Надеюсь, что ответит на ваш вопрос.

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

Это работает! Не анимируется во второй раз, форма внезапно появляется, но она выполняет эту работу. Большое спасибо. –

+0

Сбросить высоту до 0 после fadeOut, $ ('. Comentwrapper'). Delay (2000) .fadeOut (200, function() {$ ('. Comentwrapper'). Css ('height', '0px')}); –

+0

Это не сработает, но я нашел способ сделать это, спасибо вам. Я могу сделать это: $ ('. Comentwrapper'). Css ({"display": "block", "height": "0px"}). Animate ({"height": "340px"}); на addBlogComent(), и он будет анимировать второй раз. Еще раз спасибо, очень ценю. –