2012-01-04 5 views
1

今日、私はダイアログボックス内にフラッシュプレーヤーを表示することになっていた作業を行っています。私はかなり簡単にそれを行うことができました。しかし、私のフラッシュプレーヤーには、フラッシュプレーヤーがダイアログボックス内にロードされた後にフォーカスが必要なテキストボックスが含まれていますが、デフォルトではフォーカスが得られません。誰も私がこの問題に取り組むのを助けることができますか?ダイアログボックス内で動的に読み込み中にフォーカスがフラッシュオブジェクトに表示されない?

私はフラッシュプレーヤーの中をクリックするとフォーカスを得ることができましたが、デフォルトではできませんでした。私は今

<!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); 

答えて

3

まず:swfobject.embedSWF(...)はに数ミリ秒が必要になりますswfをHTMLに埋め込みます。だから即時に電話することはできません$('#flashApp').tabIndex=0;または$('#flashApp').focus();

2番目:$('#flashApp')は何も返されません。

第3位:setTimeout(setFocusToFlash(), 2000);が間違っています。この関数はすぐに呼び出されます。正解はsetTimeout(setFocusToFlash, 2000);

これらの3つを修正することで以下を行う方法を参照してください。

最初にこのような関数を宣言します。これはfirefoxで動作するものです。

function setFocusToFlash() { 
    document["flashApp"].tabIndex=0; 
    document["flashApp"].focus(); 
} 

そのwindow["flashApp"].focus();を作業する他のブラウザで動作するはずない場合。私はフォーカスを取得するため

そして

500msの

swfobject.embedSWF(
      "testFocusProject.swf", "flashContent", 
      "840px", "500px", 
      swfVersionStr, xiSwfUrlStr, 
      flashvars, params, attributes, function(){ 
       setTimeout(setFocusToFlash, 500); 
     }); 

以下に示すようembedSWFで準備ができてコールバックを利用するには十分でした。必要な遅延をテストして設定できます。

+0

本当に素敵なポストありがとう –

+0

ファイヤーバグを使いますか?実行がどこに行くかを確認してください。私がテストできるURLはありますか? – Diode

+1

これはお見逃しです。 'document [" flashApp "]。tabIndex = 0;'編集された答えを見てください。 – Diode

関連する問題