当我点击特定数据时，如何重定向到另一个html页面
How do i redirect to another html page when i click on the specific data
目前我正在考虑这组完整的日历代码。
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8' />
<link href='fullcalendar.css' rel='stylesheet' />
<link href='fullcalendar.print.css' rel='stylesheet' media='print' />
<script src='moment.min.js'></script>
<script src='jquery.min.js'></script>
<script src='fullcalendar.min.js'></script>
<script>
$(document).ready(function() {
$('#calendar').fullCalendar({
header: {
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay'
},
selectable: true,
selectHelper: true,
select: function(start, end) {
var title = prompt('Event Title:');
var eventData;
if (title) {
eventData = {
title: title,
start: start,
end: end
};
$('#calendar').fullCalendar('renderEvent', eventData, true); // stick? = true
}
$('#calendar').fullCalendar('unselect');
},
editable: true,
eventLimit: true, // allow "more" link when too many events
events: [
{
title: 'All Day Event',
start: '2015-12-01'
},
{
title: 'Long Event',
start: '2015-12-07',
end: '2015-12-10'
},
{
id: 999,
title: 'Repeating Event',
start: '2015-12-09T16:00:00'
},
{
id: 999,
title: 'Repeating Event',
start: '2015-12-16T16:00:00'
},
{
title: 'Conference',
start: '2015-12-11',
end: '2015-12-13'
},
{
title: 'Meeting',
start: '2015-12-12T10:30:00',
end: '2015-12-12T12:30:00'
},
{
title: 'Lunch',
start: '2015-12-12T12:00:00'
},
{
title: 'Meeting',
start: '2015-12-12T14:30:00'
},
{
title: 'Happy Hour',
start: '2015-12-12T17:30:00'
},
{
title: 'Dinner',
start: '2015-12-12T20:00:00'
},
{
title: 'Birthday Party',
start: '2015-12-13T07:00:00'
},
{
title: 'Click for Google',
url: 'http://google.com/',
start: '2015-12-28'
}
]
});
});
</script>
<style>
body {
margin: 40px 10px;
padding: 0;
font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
font-size: 14px;
}
#calendar {
max-width: 900px;
margin: 0 auto;
}
</style>
</head>
<body>
<div id='calendar'></div>
</body>
</html>
然而，我想修改这个日历，这样当我点击特定日期时，它会把我带到另一个html页面。
我想使用这个代码，我在网上找到
dayClick: function() {
window.location.href = "testing.html";
}
但当我把它粘贴到代码中时，它只会给我一个空白页。
很抱歉，如果这是一个愚蠢的问题，但如果我的问题有任何好的答案或任何好的参考，我将不胜感激。
插入dayclick函数时的代码。
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8' />
<link href='fullcalendar.css' rel='stylesheet' />
<link href='fullcalendar.print.css' rel='stylesheet' media='print' />
<script src='moment.min.js'></script>
<script src='jquery.min.js'></script>
<script src='fullcalendar.min.js'></script>
<script>
$(document).ready(function() {
$('#calendar').fullCalendar({
header: {
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay'
},
selectable: true,
selectHelper: true,
select: function(start, end) {
var title = prompt('Event Title:');
var eventData;
if (title) {
eventData = {
title: title,
start: start,
end: end
};
$('#calendar').fullCalendar('renderEvent', eventData, true); // stick? = true
}
$('#calendar').fullCalendar('unselect');
},
editable: true,
eventLimit: true, // allow "more" link when too many events
dayClick: function() {
window.location.href = "testing.html";
}
events: [
{
title: 'All Day Event',
start: '2015-12-01'
},
{
title: 'Long Event',
start: '2015-12-07',
end: '2015-12-10'
},
{
id: 999,
title: 'Repeating Event',
start: '2015-12-09T16:00:00'
},
{
id: 999,
title: 'Repeating Event',
start: '2015-12-16T16:00:00'
},
{
title: 'Conference',
start: '2015-12-11',
end: '2015-12-13'
},
{
title: 'Meeting',
start: '2015-12-12T10:30:00',
end: '2015-12-12T12:30:00'
},
{
title: 'Lunch',
start: '2015-12-12T12:00:00'
},
{
title: 'Meeting',
start: '2015-12-12T14:30:00'
},
{
title: 'Happy Hour',
start: '2015-12-12T17:30:00'
},
{
title: 'Dinner',
start: '2015-12-12T20:00:00'
},
{
title: 'Birthday Party',
start: '2015-12-13T07:00:00'
},
{
title: 'Click for Google',
url: 'http://google.com/',
start: '2015-12-28'
}
]
});
});
</script>
<style>
body {
margin: 40px 10px;
padding: 0;
font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
font-size: 14px;
}
#calendar {
max-width: 900px;
margin: 0 auto;
}
</style>
</head>
<body>
<div id='calendar'></div>
<div id="dialog" title="My dialog" style="display:none">
<form>
<fieldset>
<label for="Id">Id</label>
<input type="text" name="name" id="name" class="text ui-widget-content ui-corner-all">
<label for="Id">Title</label>
<input type="text" name="title" id="title" class="text ui-widget-content ui-corner-all">
</fieldset>
</form>
</div>
</body>
</html>
在选择回叫时添加重定向
select: function(start, end) {
var title = prompt('Event Title:');
var eventData;
if (title) {
eventData = {
title: title,
start: start,
end: end
};
$('#calendar').fullCalendar('renderEvent', eventData, true); // stick? = true
}
$('#calendar').fullCalendar('unselect');
if(/* your condition here */){
window.location.href = "testing.html";
}
}
尝试/为url 提供一些相关上下文
dayClick: function() {
window.location.href = "/testing.html"; //assuming that testing.html is in same folder as your current html file.
},
或者简单地使用window.location.replace
dayClick: function() {
window.location.replace= "testing.html";
},
相关文章：
- 如何在一页网站中使用PHP重定向到一个页面
- php重定向到一个空白页面
- 在发布表单输入时，我可以重定向到一个新的php文件吗
- Firefox弹出窗口“;这个网页被重定向到一个新的位置“;在每个requestPromise ajax调用上，有什么方
- Facebook重定向到一个空白的权限请求页面
- 如何在组合框值更改时自动重定向下一个 jsp 页面
- 如何在更改字段中的选择后重置另一个字段中的数据
- 如果另一个下拉列表选择发生更改，则重置另一个下拉列表
- 重置另一个字段Primefaces的字段值
- javascript可以将我的页面重定向到一个url，如果失败，则不会发出警报
- 点击产品，它会自动重定向另一个网站
- 在选择电台，重定向到一个链接
- Phonegap Hybrid App - JavaScript重定向使一个绝对定位的元素闪烁并显示后面的内容
- 我需要做一个网站重定向到一个页面后21.45至10.00
- 如何使javascript加载新数据每次(不使用缓存数据)，当我重定向到一个处理程序(页)在鼠标点击
- 重定向选择一个选择输入
- 我如何得到chrome.tab .update重定向到一个url
- 检查在旧版Internet Explorer中事件重定向期间一个事件是否与另一个事件相同
- 等待两秒钟，然后在jquery中自动重定向另一个页面
- Php重定向到一个服务器到另一个服务器的Php页面
