Question

假设我的HTML网页中有一个iframe，其中包含部分HTML数据。它有一个搜索文本框的输入。我想，当我在输入中写一些内容时，使用onkeypress事件，我可以在跨度中显示数据。

我该怎么做？

我读了许多不同的建议，但没有一个能为我正常工作！请注意，网页位于同一个网域，但我无法访问iframe网页代码！任何人都可以帮我写作吗？

以下是我需要的简化代码：

$(document).ready(function() {  

$('#iframeDoc').ready(function(){
$(this).contents().on('keypress', function(event) { 
  // add pressed keys to span });
});
$('#iframeDoc').attr("src","JavaScript:'iframe content'");

});

主页HTML：

<html>
<body>
<iframe id="iframeDoc" src="iframepage.html"></iframe>
</body>
</html>

iframepage html：

<html>
<body>
<input type="text" />

<span id="result"></span>
</body>
</html>

Answer 1

用于捕获iframe中的任何keyup事件的通用函数，例如

$(document.getElementById('frame-id').contentWindow.document).keyup(function(e){
     //code here
});

另外你可以使用代码来访问iframe中的元素（注意我在你的input元素中添加了一个ID）：

$('#iframe').contents().find('#element_id');

所以把它们放在一起，你能不能做到这样的事情：

$(document.getElementById('frame-id').contentWindow.document).keyup(function(e){
   if($('#iframe').contents().find('#element_id').is(":focus")){
      //code here
   }       
});

我认为对您的代码起作用的示例：

https://jsfiddle.net/42j45kmn/7/

如何在其父页面的iframe输入中使用keypress事件？

1 个答案: