Question

我有一个带有HTML内容的花式包装盒。

$( '#rename' ).fancybox(    
    {
        content: $( '#rename-container' ).html(),
        afterShow: 
            function()
            {
                // some code here 
            }
    } 
);

重命名容器 是一个内部HTML的div元素。如何在afterShow处理函数中使用jQuery（或其他东西）访问内容？

E.g。内容包含输入元素，我必须设置焦点。

Answer 1

在afterShow中，我们可以通过回忆 $（'。fancybox-inner'）来访问。

$( '#rename' ).fancybox(    
    {
        content: $( '#rename-container' ).html(),
        afterShow: 
            function( el )
            {
                var overlay = $('.fancybox-inner');
                var newNameInput = overlay.find( 'input' );                     
                newNameInput.focus(); 
            }
    } 
);

Answer 2

在html中通过#rename-container直接定位元素href会更容易

<a id="rename" class="fancybox" href="#rename-container">open fancybox</a>

然后使用其选择器（如

）对任何元素进行focus

$("#rename").fancybox({
    afterShow: function () {
        $("#myInput").focus();
    }
});

参见 JSFIDDLE

Fancybox：从事件回调中访问内容

2 个答案: