使用javascript的Asp更新面板

我使用jquery创建了一个图表，并将div标记放在更新面板中。每当面板更新时，图表就会消失。 我的代码

$（文档）.ready（函数（）{
$（“#测试圆”）({
动画：1，
动画步骤：5，
没错，
前地面边界宽度：15，
背景边框宽度：15，
百分比：document.getElementById（“”.innerHTML，
文本：document.getElementById（“”）.innerHTML+'%'，
文本大小：28，
textStyle:'字体大小：12px；'，
textColor:“#fff”，
});
});

---

现在，我该怎么办？

在

UpdatePanel

更新之后，DOM发生了变化，JavaScript不再适用于该部分，因此需要重新初始化它

您可以使用“更新”面板提供的工具来实现这一点。 一种方法是使用pageLoad（）javascript函数

function pageLoad()
{
    // init here your javascript
    // This is called when the page load first time
    //  and called again each time you have an Update inside an UpdatePanel
}

另一种方法是像这样初始化

EndRequest

<script type="text/javascript"> 
   $(document).ready(function () {
       var prm = Sys.WebForms.PageRequestManager.getInstance();    
       prm.add_initializeRequest(InitializeRequest);
       prm.add_endRequest(EndRequest);

       // Place here the first init
       initGraph();
    });        

    function InitializeRequest(sender, args) {
    }

    function EndRequest(sender, args) {
       // after update occur on UpdatePanel re-init what you need
       initGraph();
    }

    function initGraph() {
        $("#test-circle").circliful({
            animation: 1,
            animationStep: 5,
            animateInView: true,
            foregroundBorderWidth: 15,
            backgroundBorderWidth: 15,
            percent: document.getElementById("<% =lbl.ClientID%>").innerHTML,
            text: document.getElementById("<% =lbl.ClientID%>").innerHTML+'%',
            textSize: 28,
            textStyle: 'font-size: 12px;',
            textColor: '#fff',
        });
    }
</script> 

$（文档）.ready（函数（）{
var prm=Sys.WebForms.PageRequestManager.getInstance（）；
prm.添加_initializeRequest（initializeRequest）；
prm.add_endRequest（endRequest）；
//在这里放置第一个init
initGraph（）；
});        
函数初始化请求（发送方，参数）{
}
函数EndRequest（发送方，参数）{
//更新后，在UpdatePanel上重新初始化您需要的内容
initGraph（）；
}
函数initGraph（）{
$（“#测试圆”）({
动画：1，
动画步骤：5，
没错，
前地面边界宽度：15，
背景边框宽度：15，
百分比：document.getElementById（“”.innerHTML，
文本：document.getElementById（“”）.innerHTML+'%'，
文本大小：28，
textStyle:'字体大小：12px；'，
textColor:“#fff”，
});
}

参考：

再加一张。在

InitializeRequest

中，我通常在更改内容之前清除任何可能正在运行的javascript处理程序或计时器

<script type="text/javascript"> 
   $(document).ready(function () {
       var prm = Sys.WebForms.PageRequestManager.getInstance();    
       prm.add_initializeRequest(InitializeRequest);
       prm.add_endRequest(EndRequest);

       // Place here the first init
       initGraph();
    });        

    function InitializeRequest(sender, args) {
    }

    function EndRequest(sender, args) {
       // after update occur on UpdatePanel re-init what you need
       initGraph();
    }

    function initGraph() {
        $("#test-circle").circliful({
            animation: 1,
            animationStep: 5,
            animateInView: true,
            foregroundBorderWidth: 15,
            backgroundBorderWidth: 15,
            percent: document.getElementById("<% =lbl.ClientID%>").innerHTML,
            text: document.getElementById("<% =lbl.ClientID%>").innerHTML+'%',
            textSize: 28,
            textStyle: 'font-size: 12px;',
            textColor: '#fff',
        });
    }
</script>