javascript - sweetalert2 : how to get autofocus on input?

Question

使用 sweetalert2@8

使用以下代码对搜索框使用甜蜜警报。自动对焦适用于 Chrome，但不适用于 Safari 和 Firefox。我们该如何解决这个问题？

swal.fire({
    // title: "Search",
    type: "question",
    html: '<form id="searchForm" method="post" action="/search">' +
        "<input type='hidden' />" +
        '<input autofocus class="form-control" type="text" name="search_box" placeholder="Seach..."></form>',
    confirmButtonText: "Search",
    showLoaderOnConfirm: true,
    preConfirm: function (value) {
        document.getElementById("searchForm").submit();
        return new Promise(resolve => {
        })
    },
});

Answer 1

我建议将 JavaScript 代码添加到 polyfill您在其他浏览器中无法获得的缺失功能。 Sweetalert2 还有一个浏览器兼容性页面 here也就是说它在所有主要浏览器中都兼容。但也建议使用以下脚本标签导入所需的 polyfill。

<!-- Include a polyfill for ES6 Promises (optional) for IE11 -->
<script src="https://cdn.jsdelivr.net/npm/promise-polyfill@8/dist/polyfill.js"></script>

就autofocus 属性而言，根据MDN，所有主流浏览器都支持它。 .您可以尝试在触发设置自动对焦属性的警报时使用 JavaScript 事件。

document.getElementById('myInput').autofocus = true;

您还可以尝试使用此示例填充 autofocus 属性本身 here .