iOS WebView中"从短信粘贴验证码"触发事件及适配问题排查

iOS WebView中Safari的短信验证码自动填充/粘贴操作不会触发标准的paste事件——它是直接将完整验证码写入单个输入框，绕过了常规的粘贴流程，这就是你监听paste无效的核心原因。你可以尝试监听以下事件来捕获这个操作：

1. 监听beforeinput事件 #

这个事件在内容插入DOM前触发，覆盖了系统级的填充行为，能直接拿到完整的验证码内容：

$(".number-input").bind("beforeinput", function(e) {
    e.preventDefault();
    let text = e.originalEvent.data?.trim() || "";
    if (!text || text.length !== 6) return;

    $(".number-input").each(function(i) {
        $(this).val(text.charAt(i));
        $(this).removeClass("untouched");
    });
});

2. 监听input事件 #

如果beforeinput不生效，退而求其次监听input事件——当系统把完整验证码塞进单个输入框后，该输入框的内容会触发input事件，你可以从这里提取完整验证码并分配：

$(".number-input").bind("input", function(e) {
    let targetInput = $(e.target);
    let fullCode = targetInput.val().trim();
    if (fullCode.length === 6) {
        e.preventDefault();
        $(".number-input").each(function(i) {
            $(this).val(fullCode.charAt(i));
            $(this).removeClass("untouched");
        });
    }
});

额外优化：配置输入框属性 #

给所有验证码输入框加上autocomplete="one-time-code"，帮助iOS系统更准确识别这是验证码输入区域，可能让填充行为更符合预期：

<input type="text" class="number-input" autocomplete="one-time-code" maxlength="1">

兜底方案 #

如果上述事件仍不生效，可以尝试监听change事件（输入框失焦时触发），或者定时检查第一个输入框的内容——当检测到6位字符串时自动分配到所有输入框。

内容的提问来源于stack exchange，提问作者O'Niel