如何在不更改属性的情况下区分id或类

时间:2011-12-26 21:23:39

标签: html css twitter-bootstrap

我正在制作一个使用Twitter bootstrap

中的bootstrap-modal.js的网页

bootstrap-modal.js允许您创建“模态”。你基本上点击一个按钮,一个小的javascript窗口向下滑动,你可以显示不同的内容等。这是一个演示http://jsfiddle.net/mjmitche/xt4aQ/44/

我的网页上会有几个按钮/模态,所以我必须将其设置为每个按钮触发一个不同的模态。我认为最好的方法是给他们不同的类或ID

问题,如果我更改bootstrap-modal.js给出的ID,它会更改模态的属性...例如,它可能会删除或添加黑屏背景等。上面链接的小提琴显示了下面的代码是如何工作的。

问题:您知道我如何区分模态,以便每个按钮触发不同的模态,但允许它们具有相同的属性吗?

          <div id="modal-from-dom" class="modal hide fade">
            <div class="modal-header">
              <a href="#" class="close">&times;</a>
              <h3>Modal Heading</h3>
            </div>
            <div class="modal-body">

            </div>
            <div class="modal-footer">
              <a href="#" class="btn primary">Primary</a>
              <a href="#" class="btn secondary">Secondary</a>
            </div>
          </div>

按钮

<button data-controls-modal="modal-from-dom" data-backdrop="true" data-keyboard="true" class="btn important">Launch left Modal</button>

1 个答案:

答案 0 :(得分:0)

你说你不能使用id那么为什么不上课呢?尝试为每个模态添加不同的类。这是您更新的小提琴:http://jsfiddle.net/xt4aQ/52/

我尝试将id更改为数字“2”并且工作正常。只需复制所有代码并通过附加升序编号来更改ID。