Javascript 我希望我的事件在单击时激活一个特定的选项卡(在日历中使用idTabs和clndr.js)
我右边有三个标签,左边有一个日历。当单击日历的一个数字(事件)时,我希望它激活tab3。idTabs似乎没有激活选项卡的方法,但我知道我们可以手动触发它,但不知道如何触发,我是js中的乞丐。 这是我已经拥有的代码,它为我提供了特定表3中事件的信息 我的jsJavascript 我希望我的事件在单击时激活一个特定的选项卡(在日历中使用idTabs和clndr.js),javascript,jquery,events,tabs,Javascript,Jquery,Events,Tabs,我右边有三个标签,左边有一个日历。当单击日历的一个数字(事件)时,我希望它激活tab3。idTabs似乎没有激活选项卡的方法,但我知道我们可以手动触发它,但不知道如何触发,我是js中的乞丐。 这是我已经拥有的代码,它为我提供了特定表3中事件的信息 我的js $(文档).ready(函数(){ $(“#日历”).clndr({ 模板:$(“#日历模板”).html(), 活动:[ {日期:'2015-04-09',标题:'CLNDR GitHub页面完成',url:'http://github.c
$(文档).ready(函数(){
$(“#日历”).clndr({
模板:$(“#日历模板”).html(),
活动:[
{日期:'2015-04-09',标题:'CLNDR GitHub页面完成',url:'http://github.com/kylestetz/CLNDR' },
{日期:'2015-04-19',标题:'CLNDR GitHub页面完成',url:'http://github.com/kylestetz/CLNDR' },
{日期:'2015-04-19',标题:'Event 2',url:'http://github.com/kylestetz/CLNDR' },
{日期:'2015-04-19',标题:'Event 3',url:'http://github.com/kylestetz/CLNDR' },
{日期:'2015-04-25',标题:'CLNDR GitHub页面完成',url:'http://github.com/kylestetz/CLNDR' }
],
单击事件:{
单击:功能(目标){
控制台日志(目标);
var输出=”;
对于(i=0;i”+target.events[i].title+“
”;
}
//警报(“当天的事件:+target.date.toString()+”\n“+输出);
document.getElementById(“tab3”).innerHTML=“日期事件:”+target.date.toString()+“
”+输出;
},
onMonthChange:功能(月){
log('您刚刚转到'+month.format('MMMM,YYYY');
}
},
doneRendering:函数(){
log('这将是附加自定义事件处理程序的好地方');
}
});
我的html
提前谢谢,我真的非常感谢你的帮助
$(document).ready(function () {
$('#calendar').clndr({
template: $('#calendar-template').html(),
events: [
{ date: '2015-04-09', title: 'CLNDR GitHub Page Finished', url: 'http://github.com/kylestetz/CLNDR' },
{ date: '2015-04-19', title: 'CLNDR GitHub Page Finished', url: 'http://github.com/kylestetz/CLNDR' },
{ date: '2015-04-19', title: 'Event 2', url: 'http://github.com/kylestetz/CLNDR' },
{ date: '2015-04-19', title: 'Event 3', url: 'http://github.com/kylestetz/CLNDR' },
{ date: '2015-04-25', title: 'CLNDR GitHub Page Finished', url: 'http://github.com/kylestetz/CLNDR' }
],
clickEvents: {
click: function (target) {
console.log(target);
var output = "";
for (i = 0; i < target.events.length; i++) {
output += " -> " + target.events[i].title + " <br /> ";
}
//alert("Events for day: " + target.date.toString() + " \n " + output);
document.getElementById("tab3").innerHTML = "Events for day: " + target.date.toString() + " <br /> " + output;
},
onMonthChange: function (month) {
console.log('you just went to ' + month.format('MMMM, YYYY'));
}
},
doneRendering: function () {
console.log('this would be a fine place to attach custom event handlers.');
}
});
<div class="col-sm-8 col-md-8 MFCBlock" id="tabsIndice">
<ul class="menu_indice idTabs">
<li><a href="#tab1">Categorias</a></li>
<li><a href="#tab2">Comentários</a></li>
<li><a href="#tab3" id="tab_3">Eventos</a></li>
</ul>
<div class="menufull" id="tab1">
<ul class="categorias_list left_cat tabs" style="list-style:none;">
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
<ul class="categorias_list right_cat tabs">
<li></li>
<li></li>
<li></li>
</ul>
</div>
<div class="menufull" id="tab2">
<ul class="categorias_list left_cat tabs" style="list-style:none;">
<li><a href="#">City Tours & Sightseeing</a></li>
<li><a href="#">City Pass & Skip the Line Tickets</a></li>
<li><a href="#">Turisticos e seguir a excursão no ônibus seguinte</a></li>
<li><a href="#">Tour Noturnos</a></li>
<li><a href="#">Cruzeiros com jantar</a></li>
</ul>
</div>
<div class="menufull" id="tab3">
<ul class="categorias_list left_cat tabs" style="list-style:none;">
<li><a href="#">City Tours & Sightseeing</a></li>
<li><a href="#">City Pass & Skip the Line Tickets</a></li>
<li><a href="#">Turisticos e seguir a excursão no ônibus seguinte</a></li>
<li><a href="#">Tours de Segway e de Caminhada</a></li>
<li><a href="#">Viagens de um dia & Excursões para fora da cidade</a></li>
</ul>
<ul class="categorias_list right_cat tabs">
<li><a href="#">Tour Noturnos</a></li>
<li><a href="#">Cruzeiros com jantar</a></li>
</ul>
</div>
</div>