0

我有以下代码可以正常工作：

// click on the button
$(".btnHeaderSearch").click(function(event) 
{ 
    event.preventDefault();
    window.open('/search.aspx?phrase=' + $('.txtHeaderSearch').val());
});

它将在新窗口/选项卡中打开 search.aspx，并且该窗口/选项卡将具有焦点或位于所有其他窗口/选项卡的前面。

但是，以下代码不起作用：

// press enter key when textbox has focus to simulate button click:
$('.txtHeaderSearch').bind('keyup', function(e) {
    if ( e.keyCode === 13 ) { // 13 is enter key
        window.open('/search.aspx?phrase=' + $('.txtHeaderSearch').val());
    }
});

这里发生的是窗口/选项卡确实打开了，但是它在所有其他窗口后面打开了一个窗口，或者它打开了一个选项卡而不给选项卡焦点，所以我最终留在了原始页面上。

如何按回车键打开一个窗口/选项卡，其行为方式与单击上面的按钮相同？即我希望这两个代码位都可以打开一个窗口或选项卡，该窗口或选项卡立即具有焦点，就像当前单击一样。

我在 IE8 中得到了这种行为。它在谷歌浏览器中运行良好，我没有在任何其他浏览器上尝试过。不幸的是，我需要让它在 IE8 中工作。

4

6 回答 6

2

来自http://msdn.microsoft.com/en-us/library/ie/ms537632(v=vs.85).aspx：

确保您的网站中的所有弹出窗口都是作为用户操作的直接结果打开的，例如单击页面元素或跳到链接然后按 ENTER。

事实上，您的代码根本不适合我，IE 默认弹出窗口阻止程序只是阻止了它。我认为这是不可接受的，因为大多数用户都不允许这样做。

我通过在按下 enter 时将焦点移动到隐藏链接（与 tab 键相同）来解决它（很重要，因为在 keyup 之后为时已晚），当它被释放时，它与在那个时按下 enter 相同链接以便弹出窗口打开。

HTML：

<input class="txtHeaderSearch">
<a id="hidden-link" href="#">needs to have content</a>

CSS：

#hidden-link {
    position: absolute;
    left: -9999px;
    top: -9999px;
}

Javascript：

$('.txtHeaderSearch').bind('keydown', function(e) {
    if (e.which === 13) { // which is normalized by jQuery
        $("#hidden-link").focus();
    }
});

$("#hidden-link").click(function() {
    var win = window.open('/search.aspx?phrase=' + $('.txtHeaderSearch').val());
    //win.focus(); 
    //The above is optional, if the window opens but doesn't focus then uncomment the above line
});

演示：

http://jsfiddle.net/UCcqM/2/

同样的解决方法不适用于其他浏览器，因此您需要检测 IE 并根据浏览器有条件地使用适当的解决方案。

于 2012-08-06T15:33:16.320 回答
1

当有人在文本框内按回车键时，使用它来单击按钮：

// press enter key when textbox has focus to simulate button click:
$('.txtHeaderSearch').keyup(function(e) {
    if ( e.keyCode === 13 ) { // 13 is enter key
        $(".btnHeaderSearch").click();    
    }
});
于 2012-07-27T14:47:52.330 回答
1

您可以尝试在 .txtHeaderSearch keyup 事件上点击 .btnHeaderSearch ，就像这样。

$('.txtHeaderSearch').bind('keyup', function(e) {
    e.preventDefault();
    if (e.keycode === 13) {   
        $('.btnHeaderSearch').click();
    }
}
于 2012-07-27T14:48:01.830 回答
0

可能问题出在动态绑定中，下面的链接对我有用， http://jsfiddle.net/madhuvana/McaXj/2/

于 2012-08-06T14:43:45.667 回答
0

例如：

    <form action="page2" method="get" onsubmit="return func()">
      <input type="text" name="search"/>
    </form>

在文本框中写入内容并按下回车 func() 将被调用，当返回 true 时，将提交表单（http://example.com?search=....）

因此，对于您的问题，您只需替换示例中的值并定义一个函数来处理预提交作业。

于 2012-08-06T12:14:36.257 回答
0

我在 IE8 中测试了这个

http://jsfiddle.net/74mtV/2/

当它第一次发生时，它会发出弹出警告，并且没有打开任何窗口，但是在允许它之后，两个事件都会打开一个新的弹出窗口，并将焦点设置为它。

在正常模式和启用兼容性的情况下进行了测试。

于 2012-08-06T10:45:08.393 回答