javascript - 弹出式点击在其他几个网站页面中不起作用

Question

我在 footer.php 页面中定义了弹出按钮，因此它也适用于其他页面，但点击仅适用于其他页面的索引页面点击不起作用。我试图创建几乎每个网页都出现的弹出式录取查询表单，这就是我在 footer.php 页面中声明弹出式的原因。但它仅适用于索引页面而不适用于其他页面。

      var s=document.createElement("script");
      s.type="text/javascript"; 
      s.async=true;   
      s.src="https://widgets.nopaperforms.com/emwgts.js";
      document.body.appendChild(s);

.modal {
        display: none; /* Hidden by default */
        position: fixed; /* Stay in place */
        padding-top: 100px; /* Location of the box */
        left: 0;
        top: 0;
        width: 100%; /* Full width */
        height: 100%; /* Full height */
        overflow: auto; /* Enable scroll if needed */
        background-color: rgb(0,0,0); /* Fallback color */
        background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
      }
      .modal .close {
        position: absolute;
        top: 35px;
        left: 25px;
        background: #00495d;
        transition: all 200ms;
        font-size: 30px;
        font-weight: bold;
        text-decoration: none;
        color: #fff;
        padding: 0px 5px;
      }
      .modal.close:hover {
        color: #ffffff;
      }
      /* Modal Content */
      .modal-content {
        background-color: #fefefe;
        margin: auto;
        padding: 20px;
        border: 1px solid #888;
        width: 50%;
      }

<div class="container sl-mob">
      <p class="enfrm3">
        <button id="myBtn" class="bt bt-md bt-bg bt-tertiary"> 
          <b>Admission  Query</b>
        </button>
      </p>
      <div id="myModal" class="modal">
        <div class="modal-content">
          <a class="close" href="#">X</a>
          <center><h4><p>Admission Query</p></h4></center>
          <div class="npf_wgts" style="width: 100%" data-height="400px" data-w="89e4d80f52cf4e3287e5d3d064911c16"></div>
        </div>
      </div>
    </div>

标签： javascriptphpjquerycss