能否在不关闭Leaflet键盘控制的前提下禁用‘6键bug’？

I’ve run into this exact frustrating issue before—Leaflet’s hardcoded keyboard control logic has a known compatibility bug tied to AZERTY (French) keyboard layouts, and it can unexpectedly affect users even if you’re not using a French keyboard. Let’s break down what’s happening and fix it properly, instead of the blunt "disable all keyboard controls" workaround.

What’s Causing the Bug? #

Leaflet’s keyboard shortcuts map the - key (QWERTY layout) to zoom out. On an AZERTY keyboard, the 6 key sits in the position where QWERTY has -. The problem is Leaflet’s logic checks for the character associated with the key press, not the physical key position—and it doesn’t account for different keyboard layouts or edge cases like system language/input method quirks. That’s why pressing 6 is triggering a zoom-out even for you.

The Problem With the Default Workaround #

Disabling all keyboard controls with map.keyboard.disable() does stop the 6 key issue, but it also kills all useful keyboard navigation: panning with arrow keys, zooming with +/-, etc. This is a terrible tradeoff for most applications.

Better Fixes: Keep Keyboard Controls, Block the Bug #

You have two clean options to resolve this without losing functionality:

Option 1: Simple Event Interception (Quickest Fix)

Listen for the keydown event on your map and prevent Leaflet from handling the 6 key specifically:

// After initializing your map instance
map.on('keydown', function(e) {
  // Check if the pressed key is "6"
  if (e.originalEvent.key === '6') {
    e.originalEvent.preventDefault();
  }
});

This is lightweight and targeted—it stops the 6 key from triggering zoom-out while leaving all other keyboard shortcuts intact.

Option 2: Override Leaflet’s Keyboard Logic (More Customizable)

If you want full control over keyboard mappings, you can extend Leaflet’s Keyboard handler to exclude the 6 key:

// Extend Leaflet's Keyboard control to skip the 6 key
L.Map.Keyboard.include({
  _onKeyDown: function(e) {
    // Exit early if the pressed key is 6
    if ((e.originalEvent || e).key === '6') return;
    
    // Run the original keyboard control logic for all other keys
    var map = this._map;
    if (!map._loaded) return;

    var evt = e.originalEvent || e;
    var key = evt.key;
    var ctrlPressed = evt.ctrlKey || evt.metaKey;

    if (key === '+' || (key === '=' && ctrlPressed)) map.zoomIn();
    else if (key === '-' || (key === '_' && ctrlPressed)) map.zoomOut();
    else if (key.match(/ArrowLeft|Left/)) map.panBy([-map._getPanSpeed(), 0]);
    else if (key.match(/ArrowRight|Right/)) map.panBy([map._getPanSpeed(), 0]);
    else if (key.match(/ArrowUp|Up/)) map.panBy([0, -map._getPanSpeed()]);
    else if (key.match(/ArrowDown|Down/)) map.panBy([0, map._getPanSpeed()]);
  }
});

This approach lets you tweak other keyboard mappings too, if needed.

Why This Happens to You #

Even if you’re not using a French keyboard, system language settings, input method editors (IMEs), or even browser-level keyboard layout overrides can cause Leaflet to interpret the 6 key press as the - character tied to zoom-out. The bug’s root is Leaflet’s lack of keyboard layout detection—it relies on hardcoded character matches instead of physical key codes.

内容的提问来源于stack exchange，提问作者user9571941