未从html按钮调用Javascript

我有一个带有按钮“NewPatients”的html页面，我正试图设置这个按钮，以打开一个带有表单的模式来填写。我似乎无法让模态出现。javascript中的“OpenModel”函数似乎没有被调用

cshtml文件：

@using PracticeApp.Controllers

@{
    ViewBag.Title = "Patients";
}

<script src="@Url.Content("../../Js/PatientFormModal.js")" type="text/javascript"></script>

<div class="title">
    <div>
        <h1 style="float: left">@ViewBag.Title</h1>
    </div>
    <div class="rmm" style="float: right; display: inline-block">
        <ul>
            <li><a href="javascript:void(0)" id="NewPatient">New Patient</a></li>
            <li><a href="javascript:void(0)" class="DeleteLink">Delete Patient(s)</a></li>
        </ul>
    </div>
</div>
<div class="content">
    <div id="modal_window">
        <div style="text-align: right;"><a id="modal_close" href="#">close <b>X</b></a></div>

        <p>Complete the form below to add a new patient:</p>

        <form id="add_patient" method="POST" action="#" accept-charset="UTF-8">
        <p><label>First Name<strong>*</strong><br>
        <input type="text" autofocus required size="48" name="fname" value=""></label></p>
        <p><label>Last Name<strong>*</strong><br>
        <input type="text" autofocus required size="48" name="lname" value=""></label></p>
        <p><label>Birthdate (mm/dd/yyyy)<strong>*</strong><br>
        <input type="text" autofocus required size="48" name="bday" value=""></label></p>
        <p><label>Practice Name<strong>*</strong><br>
        <input type="text" autofocus required size="48" name="location" value=""></label></p>
        <p><label>SSN<strong>*</strong><br>
        <input type="text" autofocus required size="48" name="ssn" value=""></label></p>
        <p><input type="submit" name="feedbackForm" value="Add Patient"></p>
        </form>
    </div>
</div>

以下是模态的CSS：

.content.overlay:before {
    content: " ";
    width: 100%;
    height: 100%;
    position: fixed;
    z-index: 100;
    top: 0;
    left: 0;
    background: #000;
    background: rgba(0,0,0,0.7);
  }

  #modal_window {
    display: none;
    z-index: 200;
    position: fixed;
    left: 50%;
    top: 50%;
    width: 360px;
    padding: 10px 20px;
    background: #fff;
    border: 5px solid #999;
    border-radius: 10px;
    box-shadow: 0 0 10px rgba(0,0,0,0.5);
  }

  .content.overlay #modal_window {
    display: block;
  }

---

脚本在HTML加载之前加载，因此DOM元素

NewPatient

尚不可用->事件未附加->单击不起作用

在HTML之后调用

PatientFormModal.js

---

编辑：看起来你的JS没有被调用，所以添加

checkForm（）

在JS文件的末尾。

在这种情况下，这并不重要，因为脚本文件只声明了一个函数，而该函数本身在html加载完成之前没有执行。但我认为，将脚本放在html的底部总是更好。我将它移到了最终版本的下方，但它仍然不起作用。吼叫声我真的希望这是一个简单的解决办法。lol@AtlasBowler别担心，我们会解决的！你能在

modal_init

函数中放一个

console.log（'test'）

，看看它是否被调用吗？添加了它，但控制台中没有出现任何东西，所以它看起来不像是被调用的。你调用过“checkForm”函数吗？如果没有，难怪什么也没发生……我想没有。我该怎么叫支票？在javascript文件的底部有一个对checkForm的调用。这就是你所指的吗？我会把右边放在在脚本文件的末尾…好的，如果你只是把它放在html文件的末尾，它应该会起作用，但是我建议你试试jquery或类似的东西，因为它可能会让事情变得更简单，因为有很多人都在想让验证更简单等等。几乎每一个脚本文件中都有内置的验证浏览器通过HTML5，你也可以看看。。。

.content.overlay:before {
    content: " ";
    width: 100%;
    height: 100%;
    position: fixed;
    z-index: 100;
    top: 0;
    left: 0;
    background: #000;
    background: rgba(0,0,0,0.7);
  }

  #modal_window {
    display: none;
    z-index: 200;
    position: fixed;
    left: 50%;
    top: 50%;
    width: 360px;
    padding: 10px 20px;
    background: #fff;
    border: 5px solid #999;
    border-radius: 10px;
    box-shadow: 0 0 10px rgba(0,0,0,0.5);
  }

  .content.overlay #modal_window {
    display: block;
  }