8

2つのボタンがあるメッセージボックスを作成しました。基本的にはjQueryプラグインであり、オーバーレイ効果のあるポップアップです。ただし、メッセージボックスが表示され、ユーザーがタブボタンを押すと、メッセージダイアログはフォーカスされません。では、どうすればメッセージボックスが表示されたら、フォーカスが自動的にメッセージボックスに移動しますか？フォーカスが失われ、ユーザーがもう一度タブボタンを押すと、メッセージダイアログに戻ります。マウスでメッセージボックスをクリックしてからタブボタンを押すと、フォーカスがボタンに移動してから消えます。これが画像ここに画像の説明を入力してくださいです。ボックスを作成するコードは次のとおりです。

var containerDiv = $("<div></div>", {
    id: config.containerDivID   
}); 

// append all the div to main Div(container)
containerDiv.append(messageDiv, buttonDiv);

centerPopup(config, containerDiv);
loadPopup(config);

function centerPopup(config, container){
    var backgroundPopup = $("<div></div>", {
        id: "backgroundPopup"
    }); //end of  imageDiv   
    $("body").append(backgroundPopup);
    $("body").append(container);
    $("#backgroundPopup").css({
        "height": windowHeight
    });
} //end of  centerPopup()

function loadPopup(config){
    //loads popup only if it is disabled
    if(popupStatus==0){
        $("#backgroundPopup").css({
            "opacity": "0.7"
        });
        $("#backgroundPopup").fadeIn("slow");
        $("#" + config.containerDivID).fadeIn("slow");
        popupStatus = 1;
   }  //end of if
} //end of function loadPopup()

ありがとう

4

2 に答える 2

-2

にフォーカスを設定することはできませんdiv。

キー押下イベントをキャッチし、手動でボタンTabにフォーカスを設定する必要があります。Yes

ボタンに既にフォーカスがある場合Yesは、ボタンにフォーカスする必要がありNoます。

$('body').live('keydown', function(e) { 
  if (is_dialog_visible) {
    var keyCode = e.keyCode || e.which; 
    if (keyCode == 9) { 
      e.preventDefault(); 
      if (container.find(".yes").is(":focus")) {
        container.find(".no").focus();
      } else {
        container.find(".yes").focus();
      }
    }
  } 
});
于 2012-04-19T11:44:51.667 に答える