Twitter bootstrap 尽管数据目标不同，但单击打开多个引导模式

大家好，我正在用php和一些ajax制作一个cms，并使用bootstrap进行后端设计。我在模态方面遇到了一个问题，第二个引导模态调用的是在它之前打开模态，这不是我想要的

只希望modal1在单击data target=“#modal1”时打开，modal2在data target=“#modal2”时打开，而不显示第一个。

谢谢你的帮助

为数据库中的名称编码，并从数据库中编辑和删除该行的链接

---

，“区域”）“>编辑

请同时添加有问题的代码。如果没有codes@CarlBinalla抱歉，我们刚刚更新了更多详细信息和当前问题体验的图像。您缺少每个模式淡入淡出类的结束div标记。
<div class="editAndDelete_box">
        <p" data-toggle="modal" data-target="#editLocation-modal" onclick="editLocationDetails('<?php echo $row['regionName'];?>',<?php echo $row['region_ID'];?>, 'Region')">edit</p>
        <!--<a href="region/editRegion.php?region_ID=< ?php echo $row['region_ID']; ?>edit</a>"-->

        <p data-toggle="modal" data-target="#deleteLocation-modal" onclick="deleteRegiononclick('<?php echo $row['regionName'];?>',<?php echo $row['region_ID'];?>, 'Region')">delete</p>
        <!--<p class="deleteRegion_btn" onclick="window.location.href='javascript:deleteRegion(< ?php echo $row['region_ID']; ?>)'">delete</p>-->
    </div>

<div class="modal fade" id="editLocation-modal" role="dialog">
<div class="modal-dialog">

  <div class="modal-content">
    <div class="modal-header">
      <button type="button" class="close" data-dismiss="modal">&times;</button>
      <h4 id="editLocation-title" class="modal-title">Modal Header</h4>
    </div>
    <div class="modal-body">
      <!--<p id="editLocation-name">Some text in the modal.</p>-->
      <p id="editLocation-message"></p>
      <input id="editLocation-name" class="form-control" type="text">
    </div>
    <div class="modal-footer">
    <button type="button" id="confirmLocationChanges-btn" class="btn btn-default" data-dismiss="modal">Save</button>
      <!--<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>-->
    </div>
  </div>

</div>

<div class="modal fade" id="deleteLocation-modal" role="dialog">
<div class="modal-dialog">

  <!-- Modal content-->
  <div class="modal-content">
    <div class="modal-header">
      <button type="button" class="close" data-dismiss="modal">&times;</button>
      <h4 id="deleteLocation-title" class="modal-title"></h4>
    </div>
    <div class="modal-body">
      <!--<p id="deleteLocation-name">Some text in the modal.</p>-->
      <p id="deleteLocation-message"></p>
      <!--<input id="deleteLocation-name" class="form-control" type="text">-->
    </div>
    <div class="modal-footer">
    <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
    <button type="button" id="deleteLocation-btn" class="btn btn-default btn-error" data-dismiss="modal">Delete</button>
      <!--<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>-->
    </div>
  </div>

</div>