Question

我正在使用支架工具来研究javascript。当我看到预览时，我可以看到一个按钮。但是，即使我多次单击按钮并更改了代码，也没有任何反应。莫代尔没有出现。我知道关于模态有很多类似的问题。我读了一些答案，但我无法解决这个问题。有人可以告诉我如何解决这个问题吗？

<!DOCTYPE html > 
<html>
<head>

     <link rel="stylesheet" href="modal.css">
</head>
<body>
   <script type="text/javascript">
    // Get the modal
    var modal = document.getElementById('myModal');

    // Get the button that opens the modal
    var btn = document.getElementById("myBtn");

    // Get the <span> element that closes the modal
     var span = document.getElementsByClassName("close")[0];

    // When the user clicks on the button, open the modal 
    btn.onclick = function() {
    modal.style.display = "block";
     }

     // When the user clicks on <span> (x), close the modal
     span.onclick = function() {
     modal.style.display = "none";
     }

     // When the user clicks anywhere outside of the modal, close it
    window.onclick = function(event) {
    if (event.target == modal) {
    modal.style.display = "none";
      }
    }
    </script>

     <!-- Trigger/Open The Modal -->
    <button id="myBtn">Open Modal</button>

     <!-- The Modal -->
     <div id="myModal" class="modal">

    <!-- Modal content -->
    <div class="modal-content">
     <span class="close">x</span>
       <p>Some text in the Modal..</p>
    </div>
</div>

Answer 1

浏览器正在从上到下加载页面。因此，您的脚本在加载html元素之前运行，但无法找到它们。

解决方案是在关闭var random = runner[Math.floor(Math.random() * runner.length)]; document.getElementById("message").innerHTML = random; var filtered = [12, 5, 8, 130, 44].filter(function(value){ return value === random; );代码之前放置class MyPeppers < ActiveRecord::Base acts_as_a_ferret() if Rails.env.production? end代码，但是在所有页面元素之后。

有关此主题的更多信息： Where is the best place to put tags in HTML markup?

Answer 2

您的Javascript在加载之前正在寻找您的按钮和模态。您需要使用onload事件，使用jQuery准备文档，或者在模式html之后放置Javascript。我在你的btn点击事件中放了一个控制台日志，这样你就可以通过查看开发工具控制台来了解它。

prepareForSegue(segue:sender:)

javascript模态不起作用

2 个答案: