Javascript 基于表单元索引在FancyBox2中加载不同的内容
我有一张表格,上面显示了演示文稿及其时间。单击单元格时,会显示一个FancyBox,其中包含演示文稿的标题、描述和发言人。前两项是静态的,但后一项会根据演示的时间而变化 我想弄清楚的是,如何根据单击的表格单元格更改同一个FancyBox的内容。细胞的数量是已知的。我得到了单元格的索引,但不确定从这里到哪里去 全文: jQuery:Javascript 基于表单元索引在FancyBox2中加载不同的内容,javascript,jquery,fancybox-2,css-tables,Javascript,Jquery,Fancybox 2,Css Tables,我有一张表格,上面显示了演示文稿及其时间。单击单元格时,会显示一个FancyBox,其中包含演示文稿的标题、描述和发言人。前两项是静态的,但后一项会根据演示的时间而变化 我想弄清楚的是,如何根据单击的表格单元格更改同一个FancyBox的内容。细胞的数量是已知的。我得到了单元格的索引,但不确定从这里到哪里去 全文: jQuery: $(document).ready(function(){ // Get table cell index // Assign dynamic con
$(document).ready(function(){
// Get table cell index
// Assign dynamic content
$('table tr:first td:eq(1)').click(function(){
// What goes here?
});
});
编辑:因为我们谈论的是静态内容,所以我的文章很长,没有用。问题的要点仍然是如何将信息引入到代码中——我将创建一些对象来描述您要添加的内容,用它们的HREF识别不同的会议/会谈。由于它是静态内容,您只需在页面加载时执行此操作,无需任何花哨的单击处理程序等
示例代码:
var meetings = {
"#pwap" : { color: "dark-pink", speakers: [ "Speaker Guy", "Speaker Girl" ] }
// And so on
}
// Then simply loop over the meetings and do your work over each one.
for (var href in meetings) {
// Color
var meeting = meetings[href];
$('a[href=' + href + ']').parent().addClass(meeting.color);
// Add speakers
var element = $(href);
var speakers = meeting.speakers;
for (var i = 0, length = speakers.length; i < length; i++) {
// Add each speaker as a paragraph with his name.
$('<p>').text(speakers[i]).appendTo(element);
}
}
这种类型的jQuery有点让我不知所措,所以我可能需要更多的帮助——不知怎的,你在GetSpeakers上把我弄丢了。我怎么点这个?这把小提琴是我困惑的地方。谢谢你的帮助。参加会议的颜色和发言人都来自我收到的电子表格,没有什么特别的。啊,我们谈论的是静态内容!当时我完全设计过度了解决方案。如果您首先使用hrefs将电子表格中提供的信息与每个元素关联起来会更好,这似乎是一种简单的方法-下面是一个示例:这很好地完成了添加扬声器和颜色,现在我只需要为不同的时间指定不同的扬声器。我可以通过在每个表单元格上添加一个类来实现这一点吗?或者这是使用current.element的地方吗?数据属性可能更合适,因为您可以在其中插入几乎任意的字符串,然后您可以将每次会议的发言人更改为类似于发言人的内容:{7:40:[people..],8:40:[more_people…]}然后使用时间信息选择合适的演讲者:var time=element.data'time';var演讲者=会议。演讲者[时间]。希望所有的嵌套对象和文字都不会太混乱。嗯,是的,我在编辑之后并没有仔细考虑这个问题。由于只有一个pwap,您需要移除所有添加的扬声器,并在fancybox打开它们时在正确的时间再次读取它们-显然,后载必须再次出现: