Question

我一直在体验jQuery在回发后无法运行的着名问题。所以我做了一些研究，最好的新方法是jQuery的live（）函数。但事实证明，这个版本自1.7版以来已被弃用，并替换为on（）函数。所以我转换了我的jQuery插件来使用on（）函数，但是在回发之后它仍然不起作用。

插件：

$(document).ready(function () {
    $('.drag').on("mouseover", function () {
        AfterPostBack();
        $(this).draggable()
          .click( function () {
              $(this).draggable({ disabled: false });
          }).dblclick( function () {
              $(this).draggable({ disabled: true });
          });
    });
    $('.text_label').on("blur",function () {

        $(this).removeClass('focus');
    });
});

var AfterPostBack = function () {
  $('.drag').draggable("option", "containment", 'parent');
  $('.drag').draggable("option", "snap", 'parent');
   $('.drag').draggable("option", "cursor", 'move');
 };

网页：

<script type="text/javascript" src="Scripts/jquery-1.8.0.min.js"></script>
<script type="text/javascript" src="Scripts/jquery-ui-1.8.23.custom.min.js"></script>
<script type="text/javascript" src="Scripts/myplugin.js"></script>
<link href="Styles/myplugin.css" rel="stylesheet" type="text/css" />

<asp:UpdatePanel runat="server" ID="UP1" UpdateMode="Conditional" ChildrenAsTriggers="false"> 
<ContentTemplate>   
 <asp:Button ID="btn_AddText" runat="server" Text="Add Text" OnClick="AddText" />
<asp:PlaceHolder ID="ph1" runat="server">
    <div class="drag">
        <asp:Label ID="lbl1" class="text_label" runat="server" Text="Click Me"/>
     </div>
</asp:PlaceHolder>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btn_AddText" EventName="Click" />
</Triggers>
</asp:UpdatePanel>

愿意为此提供一些帮助。感谢。

Answer 1

您可以使用function pageLoad(sender, args) { }代替$(document).ready()

而不是针对特定于浏览器的优化，而是通过更统一的流程调用ASP.NET AJAX pageLoad（）快捷方式函数。

通过调用setTimeout，超时为0毫秒，该进程在所有浏览器上以相同的方式排队。这个技巧利用JavaScript的单线程执行模型（理论上）将init事件推回到DOM完成加载之后。

反直觉地说，这不是调用pageLoad（）的唯一点。每次部分回发后也会调用它。它基本上是Application.Init和PageRequestManager.EndRequest的组合。

来源：https://encosia.com/document-ready-and-pageload-are-not-the-same/

Answer 2

有2个事件add_init和document.ready每页刷新运行相同的时间

，第二个是触发每个异步回发的页面加载，但在第一次加载时没有触发

我制作了3个函数并将代码放在相关的地方

Sys.Application.add_init(function () {
        // Initialization code here, meant to run once.
        try {
            //doOnes();
            doAllways();
        } catch (e) {
            console.log('Sys.Application.add_init: ', e);
        }
});

$(document).ready(function () {
  console.log('document.ready');
  //doAllways();
}

function pageLoad() {
  console.log('pageLoad');
  //doAftrerAjax();
  doAllways();
}

function doOnes() {
  console.log('doOnes');
}

function doAftrerAjax() {
  console.log('doAftrerAjax');
}

function doAllways(){
  console.log('doAllways');
  AfterPostBack();             <---this the place for the code
}

`

使用on（）的UpdatePanel + jquery

2 个答案: