在输入字段中键入正斜杠时,Edge 浏览器会显示弹出窗口

问题描述 投票:0回答:0

我正在开发一个边缘扩展,其中包括一个输入字段,用户可以在其中输入一个定界符作为 gitlab 中分支名称的“文件夹”定界符(将根据文件夹名称对分支进行分组)。但是,当用户在输入字段中键入正斜杠 (/) 作为第一个字符时,Edge 会显示一个弹出窗口,上面写着“开始键入以搜索”,并且还会显示一个“管理个人信息”按钮。这种行为会让用户感到厌烦。

在输入字段中输入正斜杠作为第一个字符时,是否有任何方法可以禁用此 Edge 浏览器行为?

这是扩展的 html,如果有帮助:

<!DOCTYPE html>
<html>
<head>
    <title>GitLab Folders</title>
    <style>
        body {
            width: 200px;
            font-family: sans-serif;
        }
        form {
            display: flex;
            flex-direction: column;
            margin: 20px 0;
        }
        h1 {
            margin-top: 20px;
            text-align: center;
            font-size: 24px;
            font-weight: bold;
        }
        label {
            margin-bottom: 20px;
            font-size: 13px;
        }
        .centered {
            display: block;
            margin: auto;
        }
        .annotation {
            font-size: 14px;
            text-align: center;
            margin-bottom: 5px;
        }
        input[type="text"] {
            padding: 5px;
            font-size: 16px;
            border: 1px solid #ccc;
            border-radius: 4px;
            width: 186px;
        }
        button[type="submit"] {
            padding: 8px 12px;
            font-size: 16px;
            background-color: #4CAF50;
            color: white;
            border: none;
            border-radius: 4px;
            cursor: pointer;
            width: 150px;
            margin-top: 5px;
        }
        button[type="submit"]:hover {
            background-color: #3e8e41;
        }
        button[disabled] {
            background-color: gray;
            color: white;
            pointer-events: none;
        }

        button[disabled]:hover {
            background-color: gray;
            color: white;
        }

    </style>
</head>
<body>
    <h1>Gitlab folder structure</h1>
    <form>
        <label for="input-field">Enter characters to serve as folder name delimiters (default is '/'): </label>
        <div>
            <span id="annotation" class="annotation">Current delimiter(s): /</span>
        </div>
        <input class="centered" type="text" id="input-field" name="input-field" autocomplete="off" placeholder="Only delimiters, ex: '/\-'">
        <button class="centered" type="submit">Submit</button>
    </form>
    <script src="popup.js"></script>
</body>
</html>

这是显示扩展弹出窗口边缘弹出窗口的屏幕截图: popup on typing '/' as first char

我尝试了各种解决方案,包括将自动完成属性设置为“关闭”,使用 keydown 事件侦听器拦截正斜杠按键,以及将 autofocus 属性添加到输入字段。这些解决方案都不适合我。

html browser microsoft-edge
© www.soinside.com 2019 - 2024. All rights reserved.