Html 如何使用注册的锚标记使用 Bootstrap 模式？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/33689352/
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
How to use Bootstrap modal using the anchor tag for Register?
提问by Lebone
I have a list of anchor tags for my navigation bar. I want to open a modal when "Register" is clicked. Here is the code:
我的导航栏有一个锚标签列表。我想在单击“注册”时打开一个模态。这是代码：
<li><a href="@Url.Action("Login", "Home")">Login</a></li>
<li><a href="#"> data-toggle="modal" data-target="modalRegister"> Register</a></li>
<div id="modalRegister" class="modal fade" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title" style="text-align-last: center">Register</h4>
</div>
<div class="modal-body">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
I normally use a button to open a modal, but I'm not quite sure how I would open it using the <a></a>tag because of the <a href""></a>. How can I achieve the results?
我通常使用按钮打开模态，但我不太确定如何使用<a></a>标签打开它，因为<a href""></a>. 我怎样才能达到结果？
回答by Sendhilkumar Alalasundaram
You will have to modify the below line:
您必须修改以下行：
<li><a href="#"> data-toggle="modal" data-target="modalRegister"> Register</a></li>
modalRegisteris the ID and hence requires a preceding #for ID reference in html.
modalRegister是 ID，因此需要#在 html 中使用前面的 ID 引用。
So, the modified html code snippet would be as follows:
因此，修改后的 html 代码片段如下：
<li><a href="#" data-toggle="modal" data-target="#modalRegister"> Register</a></li>
回答by Mtu
https://www.w3schools.com/bootstrap/bootstrap_ref_js_modal.asp
https://www.w3schools.com/bootstrap/bootstrap_ref_js_modal.asp
Note: For <a>elements, omit data-target, and use href="#modalID"instead.
注意：对于<a>元素，省略 data-target 并使用href="#modalID"。
回答by Anupam M
Just Replace it
只需更换它
<li><a href="" data-toggle="modal" data-target="#modalRegister"> Register</a></li>
<li><a href="" data-toggle="modal" data-target="#modalRegister"> Register</a></li>
instead of
代替
<li><a href="#"> data-toggle="modal" data-target="modalRegister"> Register</a></li>
回答by Raphael
Here is a link to W3Schools that answers your question https://www.w3schools.com/bootstrap/bootstrap_ref_js_modal.asp
这是 W3Schools 的链接，可以回答您的问题 https://www.w3schools.com/bootstrap/bootstrap_ref_js_modal.asp
Note: For anchor tag elements, omit data-target, and use href="#modalID" instead:
注意：对于锚标记元素，省略 data-target，并使用 href="#modalID" 代替：
I hope that helps
我希望有帮助
