2015-06-26 2 views
1

Есть ли способ задержки/таймаута обратной передачи из кнопки списка в jQuery? Я хотел бы сделать анимацию fadeOut до обратной передачи, которая срабатывает при нажатии кнопки. Есть идеи?Способ задержки/отсрочки в jQuery?

Мой код:

$(document).ready(function() { 
    $('.btndown').click(function() { 
     $('.imageset').animate({ 'opacity': 0 }, 1000); 
    }); 
}); 

Кнопка разметки, которая становится постбэк, когда он щелкнул:

<div class="btndown"> 
     <asp:DataPager ID="DataPager2" runat="server" PagedControlID="Listview1" PageSize="3"> 
      <Fields> 
       <asp:NextPreviousPagerField ButtonType="Image" FirstPageText="" LastPageText="" NextPageImageUrl="~/images/arrowbtndown.png" NextPageText="" PreviousPageText="" ShowPreviousPageButton="False"/> 
      </Fields> 
     </asp:DataPager> 
</div> 

выход Кнопка:

<input type="image" name="ctl00$ContentPlaceHolder1$DataPager2$ctl00$ctl00" src="images/arrowbtndown.png"> 
+2

Что делает ваш постбэк выглядеть? Предоставьте это тоже. – urbz

+0

Обратная почта меняет страницу в списке. Я хотел бы fadeOut это до обратной передачи, потому что на pageLoad у меня есть fadeIn, так что это будет плавный эффект fadeOut/fadeIn. – Ashiv3r

+0

@ Ashiv3r: опубликуйте разметку своей кнопки, n, когда она получит обратную передачу? –

ответ

1

Не следует использовать тайм-аут, использование animation complete callback.

// This stops the `postback` from being fired on the `<asp>` generated button. 
$('.btndown input').click(function(e){ 
    e.preventDefault(); 
}); 

$('.btndown').click(function (e) { 
    e.preventDefault(); 
    $('.imageset').animate({ 
     'opacity': 0 
    }, 1000, function() { 
      // Animation has completed 
      // Trigger the 'postback' JS function, whatever this may be. 
    }); 
}); 

В зависимости от того, что это выводит:

<asp:DataPager ID="DataPager2" runat="server" PagedControlID="Listview1" PageSize="3"> 
     <Fields> 
      <asp:NextPreviousPagerField ButtonType="Image" FirstPageText="" LastPageText="" NextPageImageUrl="~/images/arrowbtndown.png" NextPageText="" PreviousPageText="" ShowPreviousPageButton="False"/> 
     </Fields> 
</asp:DataPager> 

будет иметь значение, как то, что этот выход может вызвать обратную передачу сразу по щелчку. Если вы разделите конечный результат, это может помочь.

+0

Конечный результат: . К сожалению, ваш jQuery тоже не работает. – Ashiv3r

+0

Мой фрагмент кода - это только часть анимации, вам нужно отключить '', а затем запустить функцию« postback »вручную в полном обратном вызове анимации, о котором я упомянул. Я не знаю, какие события javascript привязаны к кнопке ''. Вам нужно узнать больше о том, что эта кнопка делает с JS. Вы можете остановить его, выполнив '$ ('. Btndown input'). Click (function (e) {e.preventDefault()});'. –

+0

Мне нужно передать postback мой атрибут имени .btndown, но я не знаю, как это сделать внутри __doPostBack(); – Ashiv3r

0

EDIT

Окончательное решение в:

<script type="text/javascript"> 
function pageLoad() { 

    $('.btndown').click(function (e) { 
     e.preventDefault(); 
     $('.imageset').animate({ 
      opacity: 0 
      }, 1000, function() { 
       __doPostBack($('.btndown input').attr('name'), ''); 
      }); 
    }); 
}; 
</script> 
Смежные вопросы