我需要能够使用onclick=“”
或类似函数打开Twitter引导模式窗口。只需要代码就可以进入onclick=“”
。我正在尝试创建一个可单击的div
来打开模式。
代码摘录:
分区代码:
<div class="span4 proj-div" onClick="open('GSCCModal');">
模态分区代码:
<div id="GSCCModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
JavaScript:
function open(x){
$(x).modal('show');
}
你不需要点击。假设您正在使用Bootstrap 3 Bootstrap 3文档
<div class="span4 proj-div" data-toggle="modal" data-target="#GSCCModal">Clickable content, graphics, whatever</div>
<div id="GSCCModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" 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="myModalLabel">Modal title</h4>
</div>
<div class="modal-body">
...
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
</div>
</div>
</div>
如果您使用的是Bootstrap 2,那么您应该遵循以下标记:http://getbootstrap.com/2.3.2/javascript.html#modals
我正在寻找onClick选项来根据列表中的项目设置模式的标题和主体。T145的回答帮了大忙,所以我想分享一下我是怎么使用它的。
确保包含JavaScript函数的标记为text/JavaScript类型,以避免冲突:
<script type="text/javascript"> function showMyModalSetTitle(myTitle, myBodyHtml) {
/*
* '#myModayTitle' and '#myModalBody' refer to the 'id' of the HTML tags in
* the modal HTML code that hold the title and body respectively. These id's
* can be named anything, just make sure they are added as necessary.
*
*/
$('#myModalTitle').html(myTitle);
$('#myModalBody').html(myBodyHtml);
$('#myModal').modal('show');
}</script>
现在可以在onClick方法中从元素(如按钮)内部调用此函数:
<button type="button" onClick="javascript:showMyModalSetTitle('Some Title', 'Some body txt')"> Click Me! </button>
必须首先创建一个JavaScript函数来保存您想要完成的操作:
function print() { console.log("Hello World!") }
然后必须在onClick方法中从元素内部调用该函数:
<a onClick="print()"> ... </a>
您可以直接从以下Bootstrap 3文档中了解更多关于模态交互的信息:http://getbootstrap.com/javascript/#modals
您的模态绑定也不正确。应该是这样的,其中“myModal”=元素的ID:
$('#myModal').modal(options)
换句话说,如果您真的想保留您已经拥有的东西,那么在GSCCModal前面加上一个“#”,看看这是否管用。
将onClick绑定到div元素也不是很明智;按钮之类的东西会更合适。
希望这有帮助!