代码之家  ›  专栏  ›  技术社区  ›  Ken Mayer

JavaScript/Ajax—文档加载,一些控件未加载

  •  0
  • Ken Mayer  · 技术社区  · 8 年前

    这有点复杂,但让我来总结一下。我有两组使用AJAX和JSON(以及PHP和…)的Javascript代码获取特定数据并加载一组控件。在一种情况下,从click事件处理程序调用所有控件都正确加载了正确的数据,一切正常。在第二种情况下,当页面第一次加载时(正确调用时,代码会在页面加载时执行,并返回值),除非我在代码中添加alert()对话框,否则实际上不会加载多个控件。如果函数中有alert(),则会加载控件。委婉地说,这令人困惑。

    代码 功与执行的代码相同。以下是加载表单时调用的代码:

    function getFirstAward()
      {
         // this has to go get the first award at the top of the list
         // (sort order) by rank and date, and return that to the entryfields:
         var namecode = document.getElementById("namecode").value;
    
         // now we need to set up the Ajax code to return just this specific
         // award, and stuff it into the fields above ..
         $.ajax
         ({
            type: "POST",
            url: "<?php echo $admin_html_RootPath; ?>lookups/returnFirstAward.php",
            data: { 'namecode' : namecode },
            dataType: "json", // return value is json array
            //cache: false,
            success: function(data)
            {
    // why is this necessary? 
    //alert( "First Award in List loaded" );
               // first get the data array and break it up ...
               document.getElementById("awardcode").value        = data[0];
               document.getElementById("currentaward").value     = data[1];
               getAwards();
               document.getElementById("awardnumber").value      = data[2];
               document.getElementById("awarddate").value        = data[3]; 
               document.getElementById("eventname").value        = data[4];
               document.getElementById("region").value           = data[5];
               // Barony ... is it empty? If not, enable it, and set the value
               if ( data[6] != "" )
               {
                  document.getElementById("barony").disabled     = false;
                  document.getElementById("barony").value        = data[6];
               }
               else
               {
                  // empty, enable, set value to empty, and disable it
                  document.getElementById("barony").disabled     = false;
                  document.getElementById("barony").value        = "";
                  document.getElementById("barony").disabled     = true;
               }
               document.getElementById("royalcode").value        = data[7];
               // this one is necessary because of the way the code for getRoyals works:
               document.getElementById("currentroyalcode").value = data[7];
               getRoyals();
    
               document.getElementById("notes").value            = data[8];
               tinymce.get('notes').setContent(data[8]);
               document.getElementById("laurelprimary").value   = data[9];
               tinymce.get('laurelprimary').setContent(data[9]);
               document.getElementById("laurelsecondary").value = data[10];
               tinymce.get('laurelsecondary').setContent(data[10]);
    
               // set focus on the currentaward entry:
               document.getElementById("currentaward").focus();
            },  // end success
            error: function( xhr, textStatus, err )
            {
               //alert( data );
               alert( xhr + "\n" + textStatus + "\n" + err );
            } // end error
         }); // end ajax call
      } // end of function: getFirstAward
    

    如果取消对alert()对话框的注释,则所有控件都会正确显示。如果没有,则最后四个没有。我试着重复这段代码,看看这是否有帮助(为不同的控件设置值等),并且没有什么不同。我试着使用位置。重载()并没有任何好处(无论是否使用参数:location.reload(true),都没有任何区别)。

    1 回复  |  直到 8 年前
        1
  •  2
  •   Waseem Siddiqui    8 年前

    我认为您的代码是在页面完全加载之前执行的,并且遗漏了正确执行代码所需的一些细节/值。尝试以下操作

    setTimeout(function() {
        getFirstAward();
    }, 0); // try changing the duration from 0 to 100/500 whichever works for u.