0

我正在使用 ASP.NET MVC3 开发仪表板，需要有两个 div，每个 div 都包含一个局部视图，以不同的时间间隔刷新数据。

因此，包含“PartialOverview”的 div“results”在 1 分钟刷新，包含“PartialOverviewRainfall”的 div“rain”在 15 分钟刷新。

引用两个部分视图/div 的索引页是我放置 JQuery 代码的位置。当我只使用一个 div 时，它可以工作，“PartialOverview”是显示的大部分，但我似乎无法正确地包含另一个 div 的代码。

这是我的代码：

<script type="text/javascript">
  $(document).ready(function() {
    $("#results").load("/EDM/Index");  
    setInterval(function() {
        $("#results").load("/EDM/Index");
    }, 60000); //Refreshes every 60 seconds  
    $.ajaxSetup({ cache: false });  
 }); 
</script> 

<div id="rain">
  @Html.Partial("PartialOverviewRainfallList")
</div>
<div id="results">
  @Html.Partial("PartialOverviewList")
</div>

有没有办法调整 javascript 代码以包含两个 div？

4

1 回答 1

2

setInterval您可以为其他部分添加另一个：

<script type="text/javascript">
    $(document).ready(function() {
        window.setInterval(function() {
            $("#results").load("/EDM/Index");
        }, 60000); //Refreshes every 60 seconds  

        window.setInterval(function() {
            $("#rain").load("/EDM/Rain");
        }, 900000); //Refreshes every 15 minutes

        $.ajaxSetup({ cache: false });  
    }); 
</script>

或尝试使用更通用的解决方案（例如使用 HTML5data-*属性）：

<div id="rain" class="refresh" data-interval="60000" data-url="@Url.Action("rainr", "edm")">
    @Html.Partial("PartialOverviewRainfallList")
</div>
<div id="results" class="refresh" data-interval="900000" data-url="@Url.Action("index", "edm")">
  @Html.Partial("PartialOverviewList")
</div>

进而：

<script type="text/javascript">
    $(document).ready(function() {
        $('.refresh').each(function() {
            var element = $(this);
            var url = element.data('url');
            var interval = element.data('interval');
            (function(element, url, interval) {
                window.setInterval(function() {
                    element.load(url);
                }, interval);
            })(element, url, interval);
        });
        $.ajaxSetup({ cache: false });  
    }); 
</script>

现在你甚至可以把它放到它所属的一个单独的 javascript 文件中。

于 2012-06-18T10:20:52.453 回答