一旦div中的内容发生更改，就会在页面中重新加载JavaScript [英] reload javascript in a page once the content in the div is changed

问题描述

我有一个导航栏，当我点击栏中的链接时，页面（div）的一个特定部分将会改变它的内容（ajax）。大部分内容是图形和表格，并使用CSS和JavaScript。问题是，只要点击链接，js的效果就不会显示/使用。我想，每当div的内容发生变化时，js都应该重新加载。我该怎么做？

以下是脚本。

 < ;脚本> 
函数loadTable（logtype）
 {
 var xmlhttp; 
 if（window.XMLHttpRequest）
 {//代码为IE7 +，Firefox，Chrome，Opera，Safari 
 xmlhttp = new XMLHttpRequest（）; 
} 
 else 
 {//代码为IE6，IE5 
 xmlhttp = new ActiveXObject（Microsoft.XMLHTTP）; 
 {
 document.getElementById（tables）。innerHTML = xmlhttp.responseText; 
 
 
 $ b $ if（logtype ==XXX）
 {
 xmlhttp.open（GET，/ con / chartUI ，真正）; 
} 
 
 xmlhttp.send（）; 
 
 
 
} 
< / script> 
  

html /导航部分
（表格是应该显示na图表的div的id和图表）

 < div class =nav-collapse sidebar-nav> 
< ul class =nav nav-tabs nav-stacked main-menu> 
< li> 
< a class =dropmenuhref =＃> < font color =＃6666FF>系统< / font> < / A> 
< ul> 
< a class =submenuhref =＃>< h2>& nbsp;& nbsp;& nbsp;& nbsp;监控< / h2>< / A>< /锂> 
< / ul> 
< / li> 
< li> 
< a class =dropmenuhref =＃>< font color =＃6666FF>维护< / font>< / a> 
< ul> 
< li> 
< a class =dropmenuhref =＃>< h2>& nbsp;& nbsp;& nbsp;& nbsp;日志< / h2>< / a> 
< ul> 
< ul>< a class =submenuhref =＃onClick =loadTable（'XXX'）>< h3>选项1< / h3>< / a>< / UL> 
< ul>< a class =submenuhref =＃onClick =loadTable（'XXX'）>< h3>选项2< / h3>< / a>< / UL> 
< ul>< a class =submenuhref =＃onClick =loadTable（'XXX'）>< h3>选项3< / h3>< / a>< / UL> 
< ul>< a class =submenuhref =＃onClick =loadTable（'XXX'）>< h3>选项4< / h3>< / a>< / UL> 
< / ul> 
< / li> 
< / ul> 
< / li> 
< / ul> 
< / div> 
  

解决方案

您可以使用窗口。 location.reload（）; 更新您的DIV内容。

编辑：

如果您使用Javascript / JQuery（AJAX）更新您的DIV内容，则无需重新加载页面。我希望你的最终要求可能是更新DIV内容。

例如：
$ b $ p $（ #YOUR_DIV_ID）。html（您的内容在这里......）;

this is how my app works.

I have a navigation bar, once I click a link from the bar, one particular part of the page (div) will change its content (ajax). Most of the contents are graphs and tables and uses css and javascript. The problem is, the effect of the js is not shown/used whenever I click the links. I figured that the js should be reload everytime the content of the div is changed. how do I do that?

Here's the script.

<script>
    function loadTable(logtype)
    {
        var xmlhttp;
        if (window.XMLHttpRequest)
        {// code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp=new XMLHttpRequest();
        }
        else
        {// code for IE6, IE5
            xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
            {
                document.getElementById("tables").innerHTML=xmlhttp.responseText;
                }
        }

        if (logtype == "XXX")
        {
            xmlhttp.open("GET","/con/chartUI",true);
        }

        xmlhttp.send();



    }
</script>  

html / navigation part (tables is the id of div that should display na charts and graph)

<div class="nav-collapse sidebar-nav">
                            <ul class="nav nav-tabs nav-stacked main-menu">
                                <li>
                                    <a class="dropmenu" href="#"> <font color="#6666FF">System</font> </a>
                                    <ul>
                                        <li><a class="submenu" href="#"><h2>&nbsp;&nbsp;&nbsp;&nbsp;Monitoring</h2></a></li>
                                    </ul>    
                                </li>
                                <li>
                                    <a class="dropmenu" href="#"><font color="#6666FF">Maintenance</font></a>
                                    <ul>
                                        <li>
                                            <a class="dropmenu" href="#"><h2>&nbsp;&nbsp;&nbsp;&nbsp;Logs</h2></a>
                                            <ul>
                                                <ul><a class="submenu" href="#" onClick="loadTable('XXX')"><h3>Option 1</h3></a></ul>
                                                <ul><a class="submenu" href="#" onClick="loadTable('XXX')"><h3>Option 2</h3></a></ul>
                                                <ul><a class="submenu" href="#" onClick="loadTable('XXX')"><h3>Option 3</h3></a></ul>
                                                <ul><a class="submenu" href="#" onClick="loadTable('XXX')"><h3>Option 4</h3></a></ul>
                                            </ul>
                                        </li>
                                    </ul>    
                                </li>
                            </ul>
                        </div>

解决方案

You can use window.location.reload(); after updating your DIV content.

EDIT:

If you are updating your DIV content using Javascript/JQuery(AJAX) then no need to reload a page. I hope your ultimate requirement might be updating the DIV content.

Ex:

$("#YOUR_DIV_ID").html("YOUR CONTENT HERE...");

这篇关于一旦div中的内容发生更改，就会在页面中重新加载JavaScript的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！