ajax 自動刷新更新面板后 jquery 不起作用

Question

<script>
    !window.jQuery && document.write('<script src="jquery-1.4.3.min.js"><\/script>');
    </script>
        //this the jquery I'm using
    <script type="text/javascript" src="jquery.fancybox-1.3.4.pack.js"></script>

<script type="text/javascript">
     //the function calls the query
    $(document).ready(function x() {
        /*
        *   Examples - images
        */
            //set the position of title on image

        $("a#example7").imagebox({
            'titlePosition': 'inside'
        });
    });

</script>

Answer 1

在 updatepanels 的異步頁面回發期間，$(document).ready 函數不會被觸發，因此必須以其他方式執行 $(document).ready 的代碼。

您可以執行以下兩種方式中的任何一種：

第一種方式：

<script type="text/javascript">
        var prm = Sys.WebForms.PageRequestManager.getInstance();
        prm.add_initializeRequest(InitializeRequest);
        prm.add_endRequest(EndRequest);
        function InitializeRequest(sender, args) {               
            //do any action that you want to be executed before postbacks
        }
        function EndRequest(sender, args) {
            $("a#example7").imagebox({
                 'titlePosition': 'inside'
            });
        }
</script>

第二種方式，即使用 RegisterStartupScript：

<script type="text/javascript">
            function CreateImageBox() {
                $("a#example7").imagebox({
                     'titlePosition': 'inside'
                });
            }
</script>

在 C# 代碼中使用：

ScriptManager.RegisterStartupScript(UpdatePanel1, UpdatePanelTab.GetType(), "createimagebox", "CreateImageBox();", true);