YouTipEvent_Metakey
# jQuery event.metaKey Property
Active event listeners often need to detect whether modifier keys are pressed during user interactions. The `event.metaKey` property is a built-in jQuery feature used to determine whether the **META** key was active when an event was triggered.
---
## Definition and Usage
The `event.metaKey` property returns a boolean value (`true` or `false`) indicating whether the **META** key was pressed down when the event occurred.
### What is the META key?
The physical key mapped to the "META" key varies depending on your operating system and keyboard layout:
* **On macOS:** It corresponds to the **Command** key (`⌘`).
* **On Windows:** It corresponds to the **Windows** key (`⊞`).
* **On Linux/Unix:** It typically corresponds to the **Super** or **Meta** key.
---
## Syntax
```javascript
event.metaKey
```
### Parameter Values
| Parameter | Type | Description |
| :--- | :--- | :--- |
| `event` | Object | **Required.** The event object passed into the event handler function by jQuery. |
### Return Value
* **`true`**: The META key was pressed when the event was triggered.
* **`false`**: The META key was not pressed.
---
## Code Examples
### Example 1: Basic Click Detection
The following example detects whether the META key is held down when a user clicks a specific button.
```javascript
$( "#checkMetaKey" ).on("click", function( event ) {
// Display true or false depending on the META key state
$( "#display" ).text( event.metaKey );
});
```
### Example 2: Creating a Multi-Select or Special Action Shortcut
You can use `event.metaKey` to trigger alternative actions, such as opening a link in a new tab or selecting multiple items in a custom UI component.
```javascript
$( ".selectable-item" ).on("click", function( event ) {
if ( event.metaKey ) {
// Perform multi-select action (e.g., Cmd + Click on Mac)
$( this ).toggleClass( "selected" );
} else {
// Perform standard single-select action
$( ".selectable-item" ).removeClass( "selected" );
$( this ).addClass( "selected" );
}
});
```
---
## Important Considerations
1. **Cross-Platform Consistency**:
Windows users are highly accustomed to using the **Ctrl** key for multi-selection and shortcuts, whereas macOS users use the **Command** (Meta) key. To create a seamless cross-platform experience, it is best practice to check both `event.ctrlKey` and `event.metaKey`:
```javascript
if ( event.ctrlKey || event.metaKey ) {
// Handle shortcut for both Windows/Linux (Ctrl) and macOS (Cmd)
}
```
2. **Browser Default Behaviors**:
Some operating systems or browsers reserve specific META key combinations for system-level shortcuts (e.g., `Cmd + D` or `Win + L`). If you are overriding these shortcuts, you may need to call `event.preventDefault()` to prevent the browser's default action from firing.