从 Ajax 表单加载内容时 JQuery 函数失败

Question

我对应用自定义 jquery 函数的图像有疑问。考虑以下代码块。

<% Dim sUniqueIdent As String = Now.Ticks.ToString%>

<div id="chart<%: sUniqueIdent %>"></div>

<script type="text/javascript">
   $(document).ready(function () {
      bindLinksForChart<%: sUniqueIdent %>();
   });

   function bindLinksForChart<%:sUniqueIdent %>(){
      $('div#chart<%: sUniqueIdent %>').chartLinks({
          charturl: '<%: Model.ChartPath %>', 
          uniqueident: '<%: sUniqueIdent %>', 
          height: '<%: Model.Height%>',
          width: '<%: Model.Width%>'        
      });
   }
</script>

我将这个嵌入（深度）到一些 jQuery 选项卡中，我使用唯一标识符，因为有许多这样的图表。

chartlinks 函数加载 div 内的图像，其中一个 div 链接浮动在顶部，当用户将鼠标悬停时这些链接变为可见。

这工作正常，直到我使用 Ajax 表单在其中一个选项卡上重新加载某些内容。当表单加载时，它会正确加载所有内容，但是无法加载图像和浮动链接（由 chartlinks 函数提供）

这是表格

<% Using Ajax.BeginForm("Tab", New With {
    .controller = "Content"},
New AjaxOptions With {
    .UpdateTargetId = "chartDiv", 
    .InsertionMode = InsertionMode.Replace, 
    .OnSuccess = "bindLinksForChart<%:sUniqueIdent%>"})

<input type="submit" id="UpdateChart" value="Update Chart" /></p>

<%End Using%>

任何帮助将不胜感激

ps。 chartDiv 是包含部分视图的 div

Answer 1

您能否详细说明您声明唯一标识符的位置以及在其中一个选项卡上重新加载某些内容的含义？

我还没有尝试过，但仍然试一试。

<% Dim sUniqueIdent As String = System.Guid.NewGuid()%>

<div id="<%: sUniqueIdent %>" class="chart"></div>

<script type="text/javascript">
   $(document).ready(function () {
      bindLinksForChart("<%: sUniqueIdent %>");
   });

   function bindLinksForChart(indentifier){
      $('.chart').chartLinks({
          charturl: '<%: Model.ChartPath %>', 
          uniqueident: identifier, 
          height: '<%: Model.Height%>',
          width: '<%: Model.Width%>'        
      });
   }
</script>

这将允许您拥有一个 java 脚本函数，而不是为您拥有的每个 div 使用不同的函数。然后您可以将您的 Ajax 表单代码更改为：

<% Using Ajax.BeginForm("Tab", New With {
    .controller = "Content"},
New AjaxOptions With {
    .UpdateTargetId = "chartDiv", 
    .InsertionMode = InsertionMode.Replace, 
    .OnSuccess = "bindLinksForChart(" + sUniqueIdent + ")"})

<input type="submit" id="UpdateChart" value="Update Chart" /></p>

<%End Using%>