JQuery событие не работает на асинхронном постбэка, фиксируя на 2 постбэка, разбивая на третий

Вот упрощенная версия моей страницы:JQuery событие не работает на асинхронном постбэка, фиксируя на 2 постбэка, разбивая на третий

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title></title> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script> 
    <script language="javascript" type="text/javascript"> 
     var cbFuncInit = function() { 
      $('div').click(function(evt) { 
       if (evt.target.type !== 'checkbox') { 
        var checkbox = $(':checkbox', this); 
        checkbox.attr('checked', !checkbox.attr('checked')); 
        evt.stopPropagation(); 
        return false; 
       } 
      }); 
     }; 

     $(document).ready(function() { 
      cbFuncInit(); 
     }); 
    </script> 
</head> 
<body> 
    <form id="form1" runat="server"> 
    <asp:ScriptManager ID="ScriptManager1" runat="server" /> 

    <div id="myDiv" style="background-color:red;height:50px;width:50px;"> 
     <asp:checkbox ID="Checkbox1" runat="server" ></asp:checkbox> 
    </div> 

    <asp:UpdatePanel ID="UpdatePanel1" runat="server"> 
     <ContentTemplate>  
      <asp:Repeater ID="Repeater1" runat="server"> 
      <ItemTemplate> 
       <div id="myDiv" style="background-color:red;height:50px;width:50px;"> 
       <asp:checkbox ID="Checkbox1" runat="server"></asp:checkbox> 
      </div> 
      </ItemTemplate> 
      </asp:Repeater> 
     </ContentTemplate> 
     <Triggers> 
      <asp:AsyncPostBackTrigger ControlID="Button1"/> 
     </Triggers> 
    </asp:UpdatePanel> 

    <asp:Button ID="Button1" runat="server" Text="Button" onclick="Button1_Click" /> 
    </form> 
</body> 
</html>

Вот упрощенный код фоновым:

protected void Button1_Click(object sender, EventArgs e) 
{ 
    var list = new List<string> { "", "", "" }; 
    Repeater1.DataSource = list; 
    Repeater1.DataBind(); 
    ScriptManager.RegisterStartupScript(Page, Page.GetType(), "", "cbFuncInit();", true); 
}

Вот проблема:

Страница позволяет вам щелкнуть div, чтобы щелкнуть его вложенный флажок. Однако при выполнении обратной передачи для большего количества флажков, а затем используя ScriptManager.RegisterStartupScript для повторной записи событий, исходный div больше не доступен для клика, а новые divs ...

ОДНАКО (он становится лучше) ...

При нажатии на кнопку еще раз, все дивы кликабельны теперь ...

НО WAIT ...

При нажатии на кнопку второй раз, первый DIV снова, больше не доступен для кликов.

Кто-нибудь знает почему? Мне было интересно, связано ли это с JQuery's event object. К сожалению, мои навыки отладки JavaScript немного превосходят нас. Спасибо за любые ответы.

источник

2009-10-23 Anonymous

Я не уверен, что происходит здесь, не глядя на фактическую версию страницы, но похоже, что происходит какой-то конфликт, когда вы перепроверяете события.

Одна вещь, вы можете попробовать это:

Сначала замените JQuery 1.2.6 с JQuery 1.3
А потом заменить $('div').click(function(evt){//function code here}) с $('div').live('click',function(evt){//function code here})

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

Надежды, которая решает проблему ...

источник

2009-10-24 01:01:41 ekhaled

Это решило мою проблему. Спасибо. – 2009-10-25 03:28:10

JQuery событие не работает на асинхронном постбэка, фиксируя на 2 постбэка, разбивая на третий

ответ

Смежные вопросы