如何在 HTML select 元素的 onChange() 处理程序中检测 CTRL 键状态

Question

我想根据是否按下 CTRL 键来处理 select 元素的更改事件，但它不起作用.

这是我所拥有的：一个 ASP.NET WebForms ListBox 控件（呈现为一个 select 元素，带有这样的选项（稍微简化）：

<select name="ctl00$ContentPlaceHolder1$MultiselectDropDownStatus" id="ctl00_ContentPlaceHolder1_MultiselectDropDownStatus" size="7" multiple="multiple">
    <option selected="selected" value="">All</option>
    <option value="1">Option 1</option>
    <option value="2">Option 2</option>
</select>

现在，当用户 select 有一个选项时，我想根据 CTRL 键的状态做一些事情。我将像这样处理更改事件：

script.AppendLine(@"        $(""#" + ClientID + @""").change(function (e) {");
//....

我想在脚本方法中检查按键状态

script.AppendLine(@"            if (e.ctrlKey) {");
script.AppendLine(@"                alert(""ctr key was pressed during the click"")");
script.AppendLine(@"            }");
//...

但是，这样，e.crtlKey 总是 undefined。

但是，当我直接处理列表框控件的点击事件时（不是通过更改事件），像这样：

script.AppendLine(@"        $(""#" + ClientID + @""").click(function (e) {");
script.AppendLine(@"            if (e.ctrlKey) {");
script.AppendLine(@"                alert(""ctr key was pressed during the click"")");
script.AppendLine(@"            }");

在这里，e.crtlKey 给了我正确的值。

为什么我无法在更改处理程序中正确获取 CTRL 键状态？

我现在正在使用 IE 11，但它应该也适用于其他主流浏览器。

更新：最初我想使用 CTRL 键状态处理具有多个 selection 的事件。我意识到这是错误的，现在我通过显式计算 selected 选项解决了这个问题。然而，这个问题仍然有效，因此我将把它留在这里：How to detect the key state in the changed handler?

Answer 1

你不能。如您所述，更改事件未定义 ctrlKey。

change is an event which uses the base event interface，不处理 ctrlKey。要定义 ctrlKey，您需要使用 TouchEvent, MouseEvent, or KeyboardEvent。

在您的示例中，click 导致 change 被触发。 click 作为 MouseEvent，具有 ctrlKey 信息，但 change 没有。

如果需要，您可以在单击事件中更新一个全局变量，该变量将指示是否按下了 ctrlKey，然后在更改事件中使用它。

如何在 HTML select 元素的 onChange() 处理程序中检测 CTRL 键状态

How to detect the CTRL-Key state in the onChange() handler for an HTML select element

asp.net

webforms

listbox

onchange

dom-events