Question

我有Javascript加载一些数据，因为它在一个循环中最终加载多次，导致冗长的等待时间。我需要找到如何只加载一次。我研究了这个问题，发现了一些代码，但不知道如何实现它。这是我能找到的关于我的问题的最佳链接：

http://blog.michaelckennedy.net/2012/10/11/preventing-javascript-files-from-loading-multiple-times/

更新：很抱歉，花了这么长时间才回来。我工作周三到周六。我被要求提供我的全部代码。我大幅削减了它。

脚本我正在加载以仅拉一次

jQuery(function($)
        {
  $('#resultA').load('DocText.html #Tablemain1');
  $('#resultB').load('DocText.html #Tablemain2');

整个代码

table class="tblrohs6" border="5" cellpadding="3" cellspacing="2">
<tr>
    <td align="center">
    <script type="text/javascript"> 
    var title = document.getElementsByTagName( "title" ).item(0); 
    document.write('<iframe src="http://some.company.com/mfgsupt/testeng/eac/b4home/city/abistatus.asp?Bldg=City&abiID='+title.innerHTML+'&Training=no" id="abiIframe" Name="abiIframe" width="550" height="55" marginwidth="0" marginheight="0" hspace="0" vspace="0" frameborder="0" ></iframe>');
    </script>
    <SCRIPT SRC="file://///namp-dsk-003/cim-cam/CAM/BOI/Abi/680/Common_Files/TitleCheck.js"></SCRIPT>

    </td>
</tr>
  <tr>
    <td bgcolor="#FFFFFF">

        <!----------------StartMain Table Placement-------------------------->

      <p class="revisionmain"> Text List - Assembly Build Instructions</p>    

      <script>
            $('#resultA').load('DocText.html #Tablemain1');
            $('#resultB').load('DocText.html #Tablemain2');
      </script>

            <p id="resultA"></p>

        <!---------------Start Assembly Buttons-------------------------------> 
      <table width="80%" border="1" align="center">
        <tr>
          <td colspan="10"><div align="center" class="row-column-headers-RoHS">Assembly Selection</div></td>
        </tr>
        <tr>
          <td><div align="center"><button id="b1" onclick="showX(2)"> 178-0416-00 </button></div></td>
          <td><div align="center"><button id="b2" onclick="showX(3)"> 178-0427-00 </button></div></td>

        </tr>
        <tr>
          <td colspan="9">
              <div align="center"><button onclick="location.reload();"> Refresh </button></div>
          </td>
        </tr>
      </table>
    <!-------------------End Assembly Button------------------------------->

            <p id="resultB"></p>            
            <p id="resultC"></p>
    </td>
  </tr>
  <!--------------------End Main Table Placement--------------------------->
  <tr>
    <td class="bodycell"><p class="section">Lower Level Casing </p>
        <table style="visibility:visible" width="100%" border="2">
          <tr>
            <td colspan="3"><ol start="1">
<!----------------------------------Body After Tables------------------------------------------------>
            <p id="result1"></p>
            <p id="result2"></p>
    </td>
  </tr>
</table>
    </td>
  </tr>
</table>
    </td>
  </tr>
</table>
<!-------------------------------------- END Body After Tables------------------------------------------>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>

<!--------------- Start Column Selector for button--------Input at end of this doc----------->
    <script>

    function showX(num) {;

<!--------------- Start Column Selector for button--------Input at end of this doc----------->

<!--------------------- Start Search Column for None------------------------>   
var tab = document.getElementById('part1Table');
var l = tab.rows.length;

for ( var i = 0; i < l; i++ ) {
    var tr = tab.rows[i];
    var cll = tr.cells[num];                                                              
    if(s = cll.innerText.indexOf('None') != -1) 
    {
<!---------------------- End Search Column for None------------------------->   
<!---------------- Start Place Lines in Document--------------------->

    jQuery(function($)
        {
                $('#resultA').load('DocText.html #Tablemain1');
                $('#resultB').load('DocText.html #Tablemain2');

                if (num==2) {
                $('#resultE').load('DocText.html #0416');}
                if (num==3) {
                $('#resultF').load('DocText.html #0427');}


                $('#result1').load('DocText.html #Line1');
                $('#result2').load('DocText.html #Line2');

        });
<!------------------ End Place Lines in Document----------------------->


if (i==1)                                                   /*Change this for "Line in ABI Doc" */
  { var e = document.getElementById('result1');             /*Change this for "Line Hidden" */
        e.style.display = 'none';}

if (i==2)                                                   /*Change this for "Line in ABI Doc" */
  { var e = document.getElementById('result2');             /*Change this for "Line Hidden" */
        e.style.display = 'none';}


}}} </script>


<!-------------------------------------Start Pull part1Table Data ---------------------------------------->
    <script type="text/javascript">
        jQuery(function($)
        {
            $('#resultZZ').load('DataTableUpdate3.html #part1Table');
        });         
    </script>

        <p id="resultZZ"></p>
<!--This is for Button Column Selector, Very Important -->      
        <input type="text" id="cellnum" value="0"/>
<!--This is for Button Column Selector, Very Important -->

Answer 1

只是为了让您知道，在您给定代码的第73行上的showX(num)函数，您的功能已经破缺，无法运行。

function showX(num) {;

Answer 2

您可以设置变量并检查它是否已设置。

示例：

if (!window.dataIsLoaded) {
    // load the data
}

window.dataIsLoaded = true;

但当然，避免在某个循环中执行这部分代码会好得多。您应该提供更多上下文来了解您正在做什么以及为什么数据将在循环中加载。

Answer 3

我最终看起来更接近代码，并且能够将我的.loads带出循环。现在结果是它不再多次重新加载相同的对象。感谢所有输入。我猜有时重新组织会产生重大影响。

Javascript - 加载一次

3 个答案: