Javascript文本文件阅读器第一次不起作用

时间:2011-06-03 15:15:07

标签: javascript text iframe

我有一个带有一些自制搜索引擎的网页,它应该在服务器端文本文件中查找一些数据。我用JS来解析这个文件,除了我第一次使用它之外它运行良好...罪魁祸首似乎是我的fetchText()函数,它不会在第一次返回任何内容。请注意,如果我在fetchText()中添加一个alert(),它可以正常工作(请参阅JS源代码中的注释)。我猜IFRAME没有满载或什么的。我该怎么办?

网页代码

       
        <form style="margin-top:15px; margin-left:15px;width:200px;">
            <input type="text" value="NGR_" id="srcTxtInput" style="margin-top:0px;margin-left:0px;width:100px;"/>
            <input type="button" value="Go" onclick="SearchString('./Coordinates.txt')" />
        </form>


    <div id="searchResults" style="vertical-align:right;margin-top:25px;"> 
        <select size="4" id="select_list" onchange="Selec_change();" ondblclick="Selec_change();" style="visibility: hidden; width:250px;margin-left:8px;" ></select>                       
        <img id="closeImg" src="./close.png" height="15px" width="15px" style="opacity:0.5;visibility:hidden; margin-left:235px;margin-bottom:5px;margin-top:5px;vertical-align:top;" alt="Close results" title="Close results"  onclick="HideSearch();" onmouseover="this.style.cursor='pointer';"/>
    </div>

JS代码

function SearchString(txtFile){
    var slist = document.getElementById('select_list');
    var str = trim(document.getElementById('srcTxtInput').value.toUpperCase()); 

    if(str == "" ){
      slist.options.length = 0; //empty list
      HideSearch();
      exit;
    }  

    var txt = fetchText(txtFile); 

//DO SOMETHING
}



function fetchText(txtFile) {

var d = document;
var txtFrame = d.getElementById('textReader');
txtFrame.src = txtFile;

 **//Note that if I add *alert(txtFrame.src)* here the function works the 1st time**

var text = '';
if (txtFrame.contentDocument) {
    var d = txtFrame.contentDocument;
    text = d.getElementsByTagName( 'BODY')[ 0].innerHTML;
}
else if (txtFrame.contentWindow) {
    var w = txtFrame.contentWindow;
    text = w.document.body.innerHTML;
}   

return text;
}

1 个答案:

答案 0 :(得分:0)

由于加载这样的页面内容是异步操作,因此在设置<iframe>的“src”属性后,您不能指望内容立即存在。您必须将搜索文本的代码放在框架文档的“加载”事件处理程序中。

这意味着你会写下这样的东西:

  fetchText(textFile, function(theText) {
    // DO SOMETHING
  });

并修改“fetchText()”更像是这样:

function fetchText(txtFile, whenLoaded) {  
  var d = document;
  var txtFrame = d.getElementById('textReader');

  txtFrame.onload = function() {
    var text = '';
    if (txtFrame.contentDocument) {
      var d = txtFrame.contentDocument;
      text = d.getElementsByTagName( 'BODY')[ 0].innerHTML;
    }
    else if (txtFrame.contentWindow) {
      var w = txtFrame.contentWindow;
      text = w.document.body.innerHTML;
    }

    whenLoaded(text);
  };

  txtFrame.src = txtFile;
}