Jquery FancyBox 目标特定的 DIV ID？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/2613025/
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
Jquery FancyBox target specific DIV ID?
提问by MrThomas
How do I get Fancy box to target a specific DIV ID on a page and not request the whole page in the fancybox.? This my code so fare
如何让花式框定位页面上的特定 DIV ID，而不是在花式框中请求整个页面。？这是我的代码
$(function() {
$(".style_image a").live('click', function(event) {
$(".style_image a").find("#show_style").fancybox();
});
});
This don't work?
这行不通？
I originally tried the following:
我最初尝试了以下方法：
$(function() {
$(".style_image a").live('click', function(event) {
$(this.href + " #show_style").fancybox();
});
});
Not sure how this done, or if it is even possible?
不确定这是如何完成的，或者甚至可能吗？
回答by Peter
If you want fancybox to open a certain div you just use the following simple steps:
如果你想让fancybox打开某个div，你只需使用以下简单步骤：
First you need a link to hook FancyBox to:
首先，您需要一个链接将 FancyBox 挂钩到：
<a href="#myDivID" id="fancyBoxLink">Click me to show this awesome div</a>
Note the div idnext to the anchor.
注意锚点旁边的div id。
Second you need a div that will be shown inside the FancyBox:
其次，您需要一个将显示在 FancyBox 内的 div：
<!-- Wrap it inside a hidden div so it won't show on load -->
<div style="display:none">
<div id="myDivID">
<span>Hey this is what is shown inside fancybox.</span>
<span>Apparently I can show all kinds of stuff here!</span>
<img src="../images/unicorn.png" alt="" />
<input type="text" value="Add some text here" />
</div>
</div>
And third some very easy javascript to hook it all together
第三，一些非常简单的 javascript 将它们连接在一起
<script type="text/javascript">
$("a#fancyBoxLink").fancybox({
'href' : '#myDivID',
'titleShow' : false,
'transitionIn' : 'elastic',
'transitionOut' : 'elastic'
});
</script>
回答by Nick Craver
You just need this selector:
你只需要这个选择器：
$("#show_style").fancybox();
The ID selector(since IDs should be unique) is just #IDGoesHere
该ID选择（因为ID应该是唯一的）只是#IDGoesHere
I thinkwhat you're after is loading the content in some fancybox, if you want to load say <div id="content"></div>from the page the href points to, you'd do this using .load():
我认为你所追求的是在一些fancybox中加载内容，如果你想<div id="content"></div>从href指向的页面加载，你可以使用.load()：
$(".style_image a").on('click', function(event) {
$('#show_style').load(this.href + " #content").fancybox();
});
.load()has an option for url selectorthat loads only part of the destination page.
.load()有一个选项url selector只加载目标页面的一部分。
