jquery select下拉菜单在打开时会忽略keydown事件？

问题描述

我试图阻止退格按钮在每个浏览器中返回一页。现在我使用这段代码：

  $（document）.on（keydown，function（e）{
 if（e.which === 8&&！$（e.target）.is（input，textarea））{
 e.preventDefault（）; 
} 
}）; 
  

除了选择字段下拉列表打开 ，这个事件被忽略，退格会让我回到一页。我怎么解决这个问题？感谢您的回答。

解决方案

仅供参考，因为您的代码在IE和FF中正常运行。

如果你真的需要这个工作，你可以渲染一个假的下拉列表，并且可以通过编程方式设置。

您可以将下拉菜单的大小更改为打开状态，如下所示：

 < div类=选择缠绕> 
< div class =fake-select>< / div> 
< select class =select> 
< option value =1>一个< / option> 
< option value =2> two< / option> 
< option value =3> three< / option> 
< / select> 
< / div> $（）。fake-select）。on（click，function（）{
 var numOfOpen = $（select.select option）。size（）; 
 $（。select）。attr（size，numOfOpen）.css（overflow，hidden）; 
 $（this）.hide（）; 
}） ; $（）。select）。on（click，function（）{
 $（。select）。attr（size，1）; 
 $（。fake-select）。show（）; 
}）; 
  

除此之外，我认为您无法执行任何操作，因为Chrome事件在下拉菜单时并未触发打开。

I'm trying to prevent backspace button to go one page back in every browser. For now I'm using this code:

$(document).on("keydown", function (e) {
    if (e.which === 8 && !$(e.target).is("input, textarea")) {
        e.preventDefault();
    }
});

It works fine for everything except when a select field dropdown list is opened, this event is ignored and a backspace takes me one page back anyway. How can I solve this problem? Thank you for your answers.

解决方案

Just for the info, this is Google Chrome specific since your code works fine in IE and FF.

If you really need this to work you could render a fake dropdown and than set select programmaticly.

You can change the size of dropdown to appear as it was open, something like this:https://jsfiddle.net/yzr2cmqv/

<div clas="select-wrap">
    <div class="fake-select"></div>
    <select class="select">
        <option value="1">one</option>
        <option value="2">two</option>
        <option value="3">three</option>
    </select>
</div>

$(".fake-select").on("click", function () {
    var numOfOpen = $("select.select option").size();
    $(".select").attr("size", numOfOpen).css("overflow", "hidden");
    $(this).hide();
});

$(".select").on("click", function () {
    $(".select").attr("size", 1);
    $(".fake-select").show();
});

Other than that I don't think you can do anything since Chrome events are not firing when dropdown is open.

这篇关于jquery select下拉菜单在打开时会忽略keydown事件？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！