我想知道如何在父页面上有一个文本输入元素,用于在父页面中搜索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);
});