0
我想單擊iframe並使用jQuery UI在新選項卡中打開鏈接，但它不起作用，並且新鏈接將在相同的標籤。 但是，如果我單擊屏幕上iframe外部的任何點，則會創建新選項卡。如何在單擊iframe時獲取iframe外部的點擊事件
我很感激，如果有人知道幫我
問候， 基督教
主要頁面
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
<style>
#tabs { margin-top: 1em; }
#tabs li .ui-icon-close { float: left; margin: 0.4em 0.2em 0 0; cursor: pointer; }
#add_tab { cursor: pointer; }
</style>
<script type="text/javascript">
$(function() {
$('.dock').find("a").click(function(event) {
event.preventDefault();
var name = $(event.currentTarget).text(),
url = $(event.currentTarget).attr("href");
createNewTab(name, url, 5, true);
return false;
});
$(this).click(function(e){
$('iframe').contents().find("a").click(function(event){
event.preventDefault();
var name = $(event.currentTarget).text(),
url = $(event.currentTarget).attr("href");
createNewTab(name, url, 5, true);
return false;
});
});
tabs = $("#tabs").tabs();
tabCounter = 1;
function selectNewTab() {
$('#tabs').tabs('option', 'active', -1);
}
function addTab(name, url) {
tabCounter++;
var tabTemplate = "<li><a href='#{href}'>#{label}</a><span class='ui-icon ui-icon-close' role='presentation'>Remover Tab</span></li>";
var id = "tabs-" + tabCounter,
li = $(tabTemplate.replace(/#\{href\}/g, "#" + id).replace(/#\{label\}/g, name)),
tabContentHtml = '<iframe id="ifr" class="tabs-iframe" src="' + url + '" width="100%" height="400" scrolling="auto" frameborder="no" align="center"></iframe>';
tabs.find(".ui-tabs-nav").append(li);
tabs.append("<div id='" + id + "'>" + tabContentHtml + "</div>");
tabs.tabs("refresh");
}
function createNewTab(name, url, size, checkTabExists) {
addTab(name, url);
selectNewTab();
}
});
</script>
</head>
<body>
<div class="content">
<div id="tabs">
<ul>
<li><a href="#tabs-1">First Tab</a></li>
</ul>
<div id="tabs-1">
<p>Tab 1</p>
</div>
</div>
</div>
<div class="dock">
<a href="another-page.html">New Tab</a>
</div>
</body>
</html>
的另一頁
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<head>
</head>
<body>
<div>
<a href="http://www.microsoft.com">Click Here</a>
</div>
</body>
</html>
我不認爲這是可能的，你想要的方式，JavaScript的同源策略會阻止任何JavaScript代碼來訪問的iFrame如果它不是在同一個域（域，協議和端口必須匹配）。 – 2013-04-27 15:06:21
感謝您的反饋。如果我已經打開了另一個域的鏈接，我同意你的看法。我做了另一個測試，在同一個域中創建第三個頁面，但也沒有工作。在我看來，這個問題與點擊事件有關，因爲如果我點擊iframe外部的屏幕上的某個地方，它會起作用。在另一個測試中，我嘗試將focus（）設置爲屏幕上的另一個元素，或者以編程方式在另一個元素上運行click（），但這也不起作用。 – ChristianB 2013-04-27 18:19:04