HTML中的对话框元素是什么？

在HTML中，元素用于创建对话框。对话框是屏幕上出现的小窗口，用于显示信息或请求用户输入数据。

如何在HTML中添加对话框

的基本语法

要在HTML中创建对话框，只需使用标签并在该标签内嵌入对话框内容。

示例：

<dialog>
    <p>Hello, đây là nội dung của hộp thoại.</p>
</dialog>

打开和关闭对话框

要打开对话框，需要使用JavaScript。您可以使用以下方法 showModal() 来打开对话框，以及方法 close() 来关闭它。

示例：

<button onclick="openDialog()">Mở hộp thoại</button>

<dialog id="myDialog">
    <p>Đây là nội dung của hộp thoại.</p>
    <button onclick="closeDialog()">Đóng</button>
</dialog>

HTML对话框中的表单

您可以在HTML对话框中插入表单，以请求用户输入数据或执行操作。

示例：

<dialog>
    <form>
        <label for="inputName">Tên:</label>
        <input type="text" id="inputName" name="name">
        <button type="submit">Gửi</button>
    </form>
</dialog>

HTML对话框中的聚焦和可访问性

HTML对话框在打开时会自动聚焦于对话框中的第一个元素。这有助于用户更容易地与对话框内容进行交互。

您也可以使用属性 autofocus 来聚焦对话框中的特定元素。

为了确保可访问性，请确保使用合适的快捷键，并在用户与对话框交互时提供指示或通知。

浏览器对HTML Dialog的支持

要检查浏览器是否支持，您可以使用JavaScript检查其属性/HTML元素。

if ("HTMLDialogElement" in window) {
    // Hỗ trợ dialog element
} else {
    // Không hỗ trợ dialog element
}

使用HTML添加对话框

使用HTML中的元素，您可以为您的网站创建简单且易用的交互式对话框。利用此功能可以提升用户体验并增强网站的交互性。