0

我想知道如何在父页面上有一个文本输入元素,该元素在父页面中搜索 iframe 的内容。

目标是处理输入文本并突出显示 iframe 中的匹配项。

任何建议的方法或参考将不胜感激。

谢谢...

编辑:我了解同源策略的限制,渲染 iframe 和 javascript 以进行搜索的父页面以及父页面上的 iframe 将具有相同的域来源。

HTML:

    <input type="text" id="searchfor"/>
<iframe src="http://www.page.com" id="search">Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euism modo typi, qui nunc nobis videntur parum clari, fiant sollemnes in futurum.
        Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tinci futurum.</iframe>

JAVASCRIPT:

$('#searchfor').keyup(function(){
         var page = $('iframe[id="search"]').contents().find("html").html();
         var pageText = page.text().replace("<span>","").replace("</span>");

    var searchedText = $('#searchfor').val();
    console.log(searchedText);
    var theRegEx = new RegExp("("+searchedText+")", "igm");    
         var newHtml = pageText.replace(theRegEx ,"<span>$1</span>");
         page.html(newHtml);
    });
4

0 回答 0