我在页面上有两种模式，（我使用bootstrap）;点击任何模式只打开第一个。我不明白js;有没有一个HTML修复？ [英] I've two modals on a page, (i'm using bootstrap); clicking on any modal opens only the the first. I don't understand js; is there an html fix?

问题描述

这是第一个模态的代码;

 < div id =
 modallinkleft> 
< a href =＃myModaldata-toggle =modal> 
< img src =mylinks / cp / 117s.jpg> 
< img src =mylinks / cp / 23s.jpg> 
< img src =mylinks / cp / 08s.jpg> 
< / a> 
 
< div class =modal-body> 
< img src =mylinks / cp / 117.jpg> 
< img src =mylinks / cp / 23.jpg> 
< img src =mylinks / cp / 08.jpg> 
< / div> 
< div class =modal-footer> 
< button class =btndata-dismiss =modalaria-hidden =true> x< / button> 
< / div> 
< / div> 
< / div> 
  

解决方案

每个模式都应该是如果给定不同的id ，并且每个链接应该针对不同的模式ID 。
所以它应该是这样的：

 < a href =＃myModaldata-toggle =模态> 
 ... 
 
 ... 
< a href =＃myModal2data-toggle =modal> 
 ... 
 
 ... 
  

这样，如果您点击第一个链接，它应该弹出第一个模式，如果你点击第二个模式 - 弹出第二个模式。

This is the code for the first modal; all that changes in the next two modals is the image links inside, but only these show up.

<div id="modallinkleft">
  <a href="#myModal" data-toggle="modal">
  <img src="mylinks/cp/117s.jpg">
  <img src="mylinks/cp/23s.jpg">
  <img src="mylinks/cp/08s.jpg">
  </a>
  <div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-body">
      <img src="mylinks/cp/117.jpg">
      <img src="mylinks/cp/23.jpg">
      <img src="mylinks/cp/08.jpg">
    </div>
    <div class="modal-footer">
      <button class="btn" data-dismiss="modal" aria-hidden="true">x</button>
    </div>
  </div>
</div>

解决方案

Each modal should be given a different id and each link should be targeted to a different modal id. So it should be something like that:

<a href="#myModal" data-toggle="modal">
...
<div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"></div>
...
<a href="#myModal2" data-toggle="modal">
...
<div id="myModal2" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"></div>
...

In this way, if you click the first link, it should pop-up the first modal and if you click the second - the second modal is popped up.

这篇关于我在页面上有两种模式，（我使用bootstrap）;点击任何模式只打开第一个。我不明白js;有没有一个HTML修复？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！