twitter-bootstrap Bootstrap Modal 没有出现
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/19927675/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Bootstrap Modal not showing up
提问by MikeStardust
Im trying to open a modal when an image is clicked with this code:
当使用以下代码单击图像时，我尝试打开模态：
<a href="#" data-toggle="modal" data-target="#download"><img class="featurette-image pull-right" src="http://i.imgur.com/96C9Nij.png"></a>
<div class="modal fade" id="download" tabindex="-1" role="dialog" aria-labelledby="downloadlabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title" id="downloadlabel">Download & Install Pixelmon</h4>
</div>
<div class="modal-body">
<p>
<strong>Installing Pixelmon</strong><br /><br />
First, you'll need to install Forge, so simply double-click "minecraftforge-installer-x.x.x-x.xx.x.xxx" and a menu will pop up for you to install forge.
</p>
<p>
Once you have done that its recommended you open the minecraft launcher, create a new profile, and select the forge version from the version dropdown.<br>After this launch minecraft and check if forge is running properly.
</p>
<p>
Now that forge is installed, you only have to copy "Pixelmon x.x.x.zip" to your %appdata%\roaming\.minecraft\mods folder.
</p>
<p>
You will need to use the previously created profile ( the forge profile ) to play with Pixelmon.
</p>
<p>
Now that you have Pixelmon installed, you may beggin your adventure on play.pokemasters.org
</p>
</div>
<div class="modal-footer">
<a href="http://download1076.mediafire.com/2yznx31i1d6g/693cqta45ppv0la/ForgePixelmon2.5.2.zip" target="blank"><button type="button" class="btn btn-danger">Download Pixelmon</button></a>.
<button type="button" class="btn btn-info" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
The thing is its not appearing when I click the image.
问题是当我单击图像时它没有出现。
回答by Ela Buwa
Have you tried, $('#download').modal("show");?
你试过$('#download').modal("show");吗？
回答by ABi
There are more than one way to show or popup your modal.
显示或弹出模态的方法不止一种。
- You can show your modal with out using script or onclicks.
- 您可以在不使用脚本或 onclicks 的情况下显示您的模式。
Here is the Example:
这是示例：
<a href="#" data-toggle="modal" data-target="#download">
Now in modal give id same as you wrote in data-target which is already done in your code 2nd use class="popup" instead of your current class,
现在在模态中给出与您在 data-target 中编写的相同的 id，这已经在您的代码中完成 2nd 使用 class="popup" 而不是您当前的类，
<div id="download" class="popup">Your modal items/elements </div>
this approach will ease you with extra coding and time.
这种方法将减轻您的额外编码和时间。
- You can also show or popup your modal with the use of onclick property,
- 您还可以使用 onclick 属性显示或弹出您的模式，
here is an Example:
这是一个例子：
<a href="#" onclick="showmodal()" data-toggle="modal" data-target="#download">
Modal
模态
<div id="download" class="popup">Your modal items/elements </div>
Script here just call your modal by id with .modal property to show or popup.
此处的脚本只需通过 id 调用您的模态并带有 .modal 属性即可显示或弹出。
function showmodal()
{
$("#download").modal("show");
}
I hope it will help you and others in future.
我希望它会在将来对您和其他人有所帮助。
Tip:You can use both data-target and onclick for one modal as well.
提示：您也可以对一种模式同时使用 data-target 和 onclick。
