Javascript 一页中有多个情态动词

我试图在一个页面中获得多个模态（弹出窗口）

一个按钮将让你看到你有什么科目，当你点击它，一个模态将打开，并显示你在什么时候，什么是家庭作业

另一个按钮将允许您添加新数据，并且将打开一个允许您添加新数据的模式

首先建立了新的数据模型

但是现在我有一个问题，当我点击主题按钮时，新数据按钮的模式会出现，我不知道为什么

代码如下：

<script type="text/javascript">
            $(document).ready(function(){
           $(".btn").click(function(){
        $("#myModal1").modal('show');

       });
            });
        </script>

$（文档）.ready（函数（）{
$（“.btn”）。单击（函数（）{
$（“#myModal1”）.modal（'show'）；
});
});

模态一号

<a href="#myModal1" class="btn btn-lg btn-primary">Nieuwe taak toevoegen</a>
                        <div id="myModal1" class="modal fade">
                <div class="modal-dialog">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                            <h4 class="modal-title">Nieuwe taak toevoegen</h4>
                        </div>
                        <div class="modal-body">
                            <table>
                            <tr>
                                <form id="form1" action="<?php $_SERVER['PHP_SELF'];?>" method="POST">
                            <td>Naam voor afspraak:</td>
                                <td><input type="text" name="afspraak"></td></tr>
                            <tr></tr>
                            <tr>
                              <td></br>Omschrijving: </td>
                              <td><textarea cols="34" rows="5" name="description"></textarea></td>
                            </tr>
                            <tr></tr>
                    <tr>
                        <td>Datum:</td>
                                        <td>
                                            <select name="day">
                                                <?php 
                                                                //Selecteerd als eerste de dag van vandaag
                                                    echo "<option selected>" .Date('d')."</option>";
                                                        for($i = 1; $i <=31; $i++)
                                                        {
                                                            echo '<option value="'.$i.'">'.$i.'</option>';
                                                        }
                                                        ?>  
                                                    </select>
                                                    <select name="month">
                                                        <?php   
                                                                //Selecteerd als eerste de maand van vandaag
                                                            echo "<option selected>" .Date('m')."</option>";
                                                                for($i = 1; $i <=12; $i++)
                                                                {
                                                                    echo '<option value="'.$i.'">'.$i.'</option>';
                                                                }
                                                        ?>
                                                    </select>
                                                    <select name="year">
                                                        <?php
                                                                //Selecteerd als eerste de jaar van vandaag
                                                            echo "<option selected>" .Date('Y')."</option>";                                                                
                                                                for($i = date("Y"); $i <= 2050; $i++)
                                                                {
                                                                    echo '<option value="'.$i.'">'.$i.'</option>';
                                                                }
                                                        ?>
                                                    </select>
                                                </td>
                                            </tr>
                                            <tr></tr>
                                            <tr>
                                                <td>Tijd: </td>
                                                <td><input type="time" name="tijd" value="<?php echo date('H:i:s');?>"></td>
                                            </tr>
                        </table>
                        </div>

                        <div class="modal-footer">
                           <!--- <button type="submit" class="btn btn-default" data-dismiss="modal" value="Toevoegen" name="submit">Toevoegen</button>--->
                                                <td><input type="submit" value="Toevoegen" name="submit"></td>
                          <!---  <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                            <button type="button" class="btn btn-primary">Save changes</button>--->
                        </div>
                    </div>
                </div> 
                </form>

&时代；
Nieuwe taak toevoegen
在js中，您正在调用modal.show（）方法。要显示的模态的值永远不会更改

应该是这样的

$(".btn").click(function(){
  var id = $(this).attr('id');
  $(id).modal('show');
});

但是你可以避免使用JS，在你的链接上使用
data toggle=“modal”
html5属性。如图所示。
你能在JS Fiddle或Bootply上模拟一下吗？我不知道这意味着什么，对不起：（jsfiddle.net或bootply.com允许您创建代码的模型，供人们处理疑难问题。目前，模拟代码并不容易，因为它包含大量PHP，因此无法直接应用于jsfiddle或bootply。如果您可以在类似于这些网站的网站上模拟代码，并将其包括在内在你的问题中，它可以在很大程度上帮助你解决这个问题。啊，谢谢！我现在明白了。我会尝试创建一个模拟的gimme Sec我尝试过引导版本，但它似乎对我不起作用！我得到的结果是：这意味着它不起作用，我不能玩它
$(".btn").click(function(){
  var id = $(this).attr('id');
  $(id).modal('show');
});