今天我完成了一项工作，我应该在对话框中显示 Flash 播放器。我能够很容易地做到这一点。但是我的 Flash 播放器包含一个文本框，一旦 Flash 播放器加载到对话框中，该文本框就需要聚焦，但默认情况下它不会聚焦。有人可以帮我解决这个问题吗？
但是，如果我们在 Flash 播放器内部单击，我就能获得焦点，但默认情况下不会。
我将向你展示我到目前为止所做的事情
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
</html>
<head>
<title></title>
<meta name="google" value="notranslate">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css" media="screen">
html, body { height:100%; }
body { margin:0; padding:0; overflow:auto; text-align:center;
background-color: #ffffff; }
object:focus { outline:none; }
#flashContent { display:none; }
</style>
<script type="text/javascript" src="jquery-1.5.1.js"></script>
<script type="text/javascript" src="jquery-ui-1.8.11.js"></script>
<script type="text/javascript" src="swfobject.js"></script>
</head>
<body>
<a class= "subskillList">test</a>
<!--<div id="activityDialog" class="nodisplay">
<div class="popup_content">
<div class="popup-title-header">
<div class="">
<span id="dialogTitle" class=""></span><a href="javascript:void(0);" id="closePlayer" title="close" class="close-button">
<span class="close-icon">close</span></a></div>
</div>-->
<div id="flashContent"></div>
<!--</div>
</div>-->
</body>
</html>
<script type="text/Javascript">
$(document).ready(function () {
var languageCode;
var contentUrl;
var flashurl;
$('.subskillList').live('click', function (event) {
flashEmbed();
Dialog($('#activityDialog'));
return false;
});
function flashEmbed() {
var swfVersionStr = "10.0.0";
var xiSwfUrlStr = "testFocusProject.swf"
var flashvars = {};
var params = {};
params.quality = "high";
params.bgcolor = "#ffffff";
params.allowscriptaccess = "always";
params.allowfullscreen = "false";
params.wmode = "opaque";
var attributes = {};
attributes.id = "flashApp";
attributes.name = "testFocusProject";
attributes.align = "middle";
swfobject.embedSWF(
"testFocusProject.swf", "flashContent",
"840px", "500px",
swfVersionStr, xiSwfUrlStr,
flashvars, params, attributes);
$('#flashApp').tabIndex=0;
$('#flashApp').focus();
}
function setFocusToFlash() {
$('#flashApp').tabIndex=0;
$('#flashApp').focus();
}
function Dialog(control) {
$dialog = $(control).dialog({
resizable: false,
autoOpen: false,
modal: true,
draggable: true,
open: function () {
var overlaywidth = $('.ui-widget-overlay').width();
$('.ui-dialog').width(840).height(540);
var x = $(window).height() / 2 - $('.ui-dialog').height() / 2;
var y = $(window).width() / 2 - $('.ui-dialog').width() / 2;
$('.ui-dialog').css('left', y + 'px');
$('.ui-dialog').css('top', x + $(window).scrollTop() + 'px');
$('body').css("overflow", "hidden");
$('.ui-widget-overlay').width(overlaywidth + 20);
setTimeout(setFocusToFlash(), 2000);
},
close: function (ev, ui) {
$('.ui-widget-overlay').stop().animate({ "opacity": "0" }, 1480);
$('body').removeAttr('style');
}
}).dialog('open');
}
});
</script>
下面的代码用于获取 Flash 对象的焦点
setTimeout(setFocusToFlash(), 2000);
最佳答案
首先:swfobject.embedSWF(...) 需要几毫秒才能将 swf 嵌入到 HTML 中。因此您无法立即调用 $('#flashApp').tabIndex=0; 或 $('#flashApp').focus();
第二:您确定$('#flashApp')正在返回任何内容吗？
第三:setTimeout(setFocusToFlash(), 2000); 是错误的。它将立即调用该函数。正确的是 setTimeout(setFocusToFlash, 2000);
请参阅下面如何通过修复这三个问题来完成此操作。
首先像这样声明函数。这就是 Firefox 中的工作原理。
function setFocusToFlash() {
document["flashApp"].tabIndex=0;
document["flashApp"].focus();
}
如果它不起作用window["flashApp"].focus();应该可以在其他浏览器中工作。
并利用 embedSWF 中的就绪回调，如下所示
swfobject.embedSWF(
"testFocusProject.swf", "flashContent",
"840px", "500px",
swfVersionStr, xiSwfUrlStr,
flashvars, params, attributes, function(){
setTimeout(setFocusToFlash, 500);
});
500ms 足以让我获得焦点。您可以测试并设置您想要的延迟。
关于jquery - 在对话框内动态加载时焦点未集中在 Flash 对象上？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/8726463/