focus（）在colorbox弹出窗口中不起作用

Question

我尝试将focus用于表单上的第一个输入字段。 但这不起作用。 当我为该输入调用attr("id")时，它起作用了。 当我将焦点放在相同的输入上时，没有看到任何结果。 我也尝试使用本机Javascript。 有谁知道该如何解决？

Answer 1

你们都误解了这个问题。 当Colorbox打开时，您无法聚焦输入字段？

...除非您将焦点添加到Colobox onComplete键上，例如

$('#mydiv a').colorbox({ onComplete:function(){ $('form input:first').focus(); }});

您还可以将焦点绑定到事件挂钩：

$('#mydiv a').bind('cbox_complete', function(){
        $('form input:first').focus();
});

这应该足以开始。

Answer 2

可能发生的情况是，当您打开颜色框时，其焦点将移至最高元素，即页面主体。 使用document.activeElement来查找焦点转到哪个元素。 然后找到您的色框的iframe或id，然后将焦点放在它上面

Answer 3

使用

$(document).ready(function() {
       // focus on the first text input field in the first field on the page
        $("input[type='text']:first", document.forms[0]).focus();
    });

Answer 4

我偶然发现了这个问题。

我认为最好有一个这样的$ .colorbox 开瓶器 ：

    function showActionForColorBox(
       _url,
       _forFocus
   ) {
   $.colorbox(
         {
            scrolling: false,
            href: _url,
            onComplete: function () {
               idColorboxAjaxIndect1.appendTo($('#cboxOverlay'));
               idColorboxAjaxIndect2.appendTo($('#cboxOverlay'));
               idColorboxAjaxIndect3.appendTo($('#cboxOverlay'));
               idColorboxAjaxIndect4.appendTo($('#cboxOverlay'));

               // --> Possible element's ID for focus
               if (_forFocus) {
                  $('#' + _forFocus).focus();
               }
               return;
            },
            onCleanup: function () {
               // TODO: ?
               return;
            },
            onClosed: function () {
               if (shouldReloadPageAfterColorBoxAction) {
                  // --> Should we reload whole page? 
                  shouldReloadPageAfterColorBoxAction = false; // NOTE: To be sure: Reset.
                  window.location.reload(false);
               }
               else if (cbEBillsActionReloadPopup) {
                  // --> Should we reload colorbox
                  cbEBillsActionReloadPopup = false;
                  showActionForColorBox(_url);
               }
               else if (cbShouldLoadAnotherContentAfterClosed) {
                  // --> Should we reload colorbox with custom content? 
                  cbShouldLoadAnotherContentAfterClosed = false;
                  $.colorbox({ html: setupContentForcbShouldLoadAnotherContentAfterClosed });
                  setupContentForcbShouldLoadAnotherContentAfterClosed = '';
               }
               return;
            }
         }
         );

   return;
}

Answer 5

您也可以使用

$.colorbox({ 

...,
trapFocus: false
});

禁用颜色盒内的焦点

Answer 6

尝试第一个选择器，

$("form input:first").focus();

http://jsfiddle.net/erick/mMuFc/