Модал w3schools не работает - PullRequest
0 голосов
/ 12 июня 2018

Я пытаюсь заставить эту модальную школу w3 работать на моем сайте, но когда кнопка нажата, она вообще не всплывает.У меня уже есть ссылка, связанная с CSS.

Я получил этот код здесь .

      <div className="sec2">


      {/*///////////////////////////////////////////////////////*/}
        <div class="w3-container">
          <h2>W3.CSS Modal</h2>
          <button onclick={document.getElementById('id01').style.display='block'} class="w3-button w3-black">Open Modal</button>
          <div id="id01" class="w3-modal">
            <div class="w3-modal-content">
              <div class="w3-container">
                <span onclick="document.getElementById('id01').style.display='none'" class="w3-button w3-display-topright">&times;</span>
                <p>Some text. Some text. Some text.</p>
                <p>Some text. Some text. Some text.</p>
              </div>
            </div>
          </div>
        </div>
        {/*///////////////////////////////////////////////////////*/}


      </div>

1 Ответ

0 голосов
/ 12 июня 2018

Проблема в том, что onclick опора ожидает функцию.

Вы должны получить то, что хотите, изменив первую кнопку на:

<button onclick={() => { document.getElementById('id01').style.display='block'}} class="w3-button w3-black">Open Modal</button>

Однако, учитывая, что выработая в React, я бы посоветовал рассмотреть возможность использования / установки состояния вместо непосредственного извлечения и управления элементами DOM.

...