Question

所以我在React中有一个项目，模态没有正确的标记。

我知道我需要拥有aria-modal="true"，但是我不确定100％是否在我拥有className的所有地方都添加了此属性。例如：

renderModal() {
    return (
      <Modal
        isOpen={this.props.isOpen}
        onRequestClose={this.toggleModal}
        contentLabel="Address Book"
        className={this.props.parentClassName ? 
            this.props.parentClassName + " address-modal" :
            "address-modal"}
        role="dialog"
      >
        {this.renderAddressForm()}
      </Modal>
    );
  }

  renderAddressForm(){
    return(
      <div className={this.props.parentClassName ? "form-"+this.props.parentClassName : null}>
        <h2 className="modal-title">{this.props.title}</h2>

我是否在所有元素中添加aria-modal="true"？className？例如<Modal>，<div>，<h2>？

我已经阅读了关于ARIA 1.1的文档，其中说：“ aria-modal属性用于表示“模式”元素的存在会阻止页面上其他内容的使用。”，但我不确定如何应用它。

Answer 1

aria-modal属性与role=dialog处于同一元素

在哪里添加aria-modal属性？

1 个答案: