使用jquery在多个html文件中搜索字符串

时间:2014-10-08 16:18:08

标签: javascript jquery html

我试着用几句话来解释我的问题。 我有一个包含各种iframe的HTML。在一个iframe中,有一个目录(TOC),另一个是在TOC中突出显示的相应元素的内容。由于存在各种TOC,可能会发生这种情况,通过点击链接,我们将被带到属于另一个TOC的主题,因此我希望TOC帧重新加载适当的TOC。为此,由于每个主题在TOC中都有唯一的ID,我会搜索所有TOC中主框架中加载的主题的ID,当我找到想要的TOC时,我将其加载到TOC框架中。

到目前为止我写的代码是seguent:

/*function called on load of each topic - it gets the topic unique id as parameter*/
function highlight(id) {
  /*the names of the HTML files containing the different tocs*/
  var tocs = ["toc.htm", "toc_documentazione.htm", "toc_flussiesteri.htm", "toc_garante.htm", "toc_legittimita.htm", "toc_normativa.htm", "toc_settori.htm", "toc_sicurezza.htm", "toc_sistemadp.htm", "toc_vistaarticolato.htm"]
  var i = 0;
  /*search within the different TOCs until you find a correspondence or there are no more TOCs*/
  while (!changeTOC(tocs[i], "a" + id) && i < tocs.length) {
    i = i + 1;
  }

  /*this line is probably wrong but the idea is to load the found TOC in the appropriate frame*/
  $(content).load(tocs[i - 1] + " #content");

}


/*function using ajax to search the id into the HTML file passed as parameter (newToc) returning the search outcome*/
function changeTOC(newToc, id) {

  var found = false;
  $.get(newToc, "html").done(
    function(temp_toc) {
      /*if the HTML contains the id we search for we return true*/
      if (temp_toc.indexOf(id) != -1)
        found = true;
    });

  /*else we return false*/
  return found;
} 

我遇到的问题是我用来搜索各种TOC文件的while循环。我做了一些调试,无论事实上包含我搜索的id的TOC是在第一个位置,while都会延续10个周期,并且只在最后它告诉我它找到了匹配的TOC,这确实是名单中的第一个。

希望我能够清楚自己。 谢谢你的帮助

1 个答案:

答案 0 :(得分:0)

我终于设法通过使用syncronus设置为true的ajax调用来完成此操作。我没有在这里发布所有代码,因为它会让人感到困惑,但下面是我改变了与上面编写的代码相比,现在一切正常。也许它在性能方面不是最优的,但我没有这个问题,所以我很高兴:) 希望这可以帮助别人。

/*function called on load of each topic - it gets the topic unique id as parameter*/

function highlight(id) {
var tmpVal = sessionStorage.getItem('key');
//we check if there is another element in the TOC currently highlighted in bold, if so we remove the highlight
if(tmpVal) {
    var tmpEle=parent.window.frames[0].document.getElementById('a'+tmpVal);
    if (tmpEle) {
        tmpEle.className='';
    }
}

//loop through all TOCs to find the one containing the selected topic
var tocs = ["toc.htm","toc_documentazione.htm","toc_flussiesteri.htm","toc_garante.htm","toc_legittimita.htm","toc_normativa.htm","toc_settori.htm","toc_sicurezza.htm","toc_sistemadp.htm","toc_vistaarticolato.htm"];     
var i=0;
while (!changeTOC(tocs[i],"a"+id)&&i<tocs.length){
    i=i+1;
}

//get currently loaded TOC
var currentToc=$("#toc_iframe",parent.document).attr("src");
var indexCurrentTOC=tocs.indexOf(currentToc);
//we check if the matching TOC is the current one, if so we don't change anything
if(!changeTOC(tocs[indexCurrentTOC],"a"+id)){
    $("#toc_iframe",parent.document).attr("src",tocs[i]);
}
var myElt=parent.window.frames[0].document.getElementById('a'+id);
//highlight current element in the TOC
myElt.focus();
myElt.className+=' active';
scrollTo(myElt.offsetLeft-48, myElt.offsetTop-(parent.document.body.clientHeight/3));
sessionStorage.setItem("key", id);
}

//searches for the element with given id into the toc file newToc 
function changeTOC(newToc,id){

var found = false;
$.ajax({
    url: newToc,
    async: false,
    context: document.body
    }).done(function(temp_toc) {
                if(temp_toc.indexOf(id)!=-1){
                    found = true;
                }
    });
return found;

}