代码之家 › 专栏 › 技术社区 › Jeff

jQuery新手,简单的弹出窗口脚本,有什么问题吗?

jquery javascript

Jeff · 技术社区 · 16 年前

对于jQuery仍然有点“害羞”。这个简单的弹出窗口脚本看起来还好吗?我的jQuery逻辑正确吗?

我对代码注释中的一些问题感到好奇。

$( document ).ready( function()
{
    $( "a[target='popup']" ).click( function( event )
    {
        var $href = $( this ).attr( 'href' ); // should I use "this.href"?
        var $name = $( this ).attr( 'target' ); // does the window name matter?
        var $config = 'width=590, height=590, top=20, left=60, scrollbars=1';
        var $popup = window.open( $href, $name, $config );

        if ( window.focus ) // is this even necessary?
                            // any other conditions I should check instead?
        {
            $popup.focus();
        }
        event.preventDefault(); // should this be above $popup.focus()?
    });
});

这似乎是可行的,但由于这个脚本对于在我的网站上获得RSS订户非常重要,我想我会确保。

3 回复 | 直到 16 年前

Fenton 16 年前

//我应该使用“this.href”吗? 不,使用jquery选择器-如果要经常使用$(this),请在开始时将其放入变量中,这样就不会有每次创建jquery对象的开销(执行两次,因此要创建两次jquery对象)。

//窗口名称重要吗? 如果以后要对窗口执行任何操作,如关闭窗口或更改其位置,则需要名称。它只是窗户的把手。

//这有必要吗?

//我还需要检查其他情况吗? Nope-测试您将调用的函数(当您聚焦弹出窗口时调用它)。

不,最好把它留到最后,因为这是其他开发人员寻找它的地方。先做所有你想做的事情,然后把它放进去,阻止事件冒泡。

$(document).ready( function() {
    $("a[target='popup']").click( function(event) {
        var myObject = $(this);
        var href = myObject.attr("href");
        var name = myObject.attr("target");
        var config = "width=590, height=590, top=20, left=60, scrollbars=1";
        var popup = window.open(href, name, config);

        if ( window.focus ) {
                popup.focus();
        }
        event.preventDefault();
    });
});

Nick Larsen 16 年前

您的javascript函数是正确的。以下是对每个问题的解释:

1)
不,您不应该这样做,因为这不是jquery的工作方式。不同浏览器的Javascript实现可能有所不同,这个jQuery函数将确保调用在它打算支持的每个浏览器中返回正确的值。虽然this.href可能会工作,但不能保证它会工作,但jQuery会工作(在它打算支持的浏览器中)。

2) 窗口名称重要吗?
对使用这个jQuery脚本的目的是控制弹出的窗口,但是,即使用户禁用了javascript,链接也应该可以工作(指向指定的窗口)。此javascript旨在让您控制窗口的外观。

3) 这有必要吗?
是的,这要追溯到你不能保证支持某些javascript特性。呼吁 window.focus 正在检查此浏览器中是否存在此元素的焦点函数。如果它确实存在,它将尝试将焦点设置为该元素,如果它不存在,它将不会在浏览器中显示为脚本错误(糟糕的用户体验)。

4) 是否应该高于$popup.focus()?
这让浏览器知道您自己成功创建并弹出了窗口,并且事件应该停止工作(从而取消浏览器打开新窗口的默认事件)。

rahul 16 年前

window.focus

前面。由于用户的原因,它可能会失败设置和窗口不可用在此之前保证是最前面的方法返回。

event.preventDefault()

如果事件可取消,则取消该事件, 不停止进一步的传播这件事的真相。

我不认为有任何区别,如果你给这上面的重点方法。