如何通过ajax增加/减少PHP变量值并重新加载函数
How to Increasing/Decreasing PHP variable value and reload function via ajax
我有一个函数,它根据变量指定日期
前任$修改="+1周"
function calendar($modification){
$month = array("Januari","Februari","Mars","April","Maj","Juni","Juli","Augusti","September","Oktober","November","December");
$date = new DateTime(date('Y-m-d'));
$date->modify($modification);
$year = $date->format('o');
$week = $date->format('W');
$fulldate = $date->format('c');
$valEnc = 'W';
$monthNum = $date->format('n');
$modDate = date('Y-m-d',strtotime($fulldate));
$mMon = date('n', mktime(0, 0, 0, date('m', strtotime("$modDate")), date("d", strtotime("$year$valEnc$week")), date("Y") ));
$mTue = date('n', mktime(0, 0, 0, date('m', strtotime("$modDate")), date("d", strtotime("$year$valEnc$week"))+1, date("Y") ));
$mWed = date('n', mktime(0, 0, 0, date('m', strtotime("$modDate")), date("d", strtotime("$year$valEnc$week"))+2, date("Y") ));
$mThu = date('n', mktime(0, 0, 0, date('m', strtotime("$modDate")), date("d", strtotime("$year$valEnc$week"))+3, date("Y") ));
$mFri = date('n', mktime(0, 0, 0, date('m', strtotime("$modDate")), date("d", strtotime("$year$valEnc$week"))+4, date("Y") ));
$mSat = date('n', mktime(0, 0, 0, date('m', strtotime("$modDate")), date("d", strtotime("$year$valEnc$week"))+5, date("Y") ));
$mSun = date('n', mktime(0, 0, 0, date('m', strtotime("$modDate")), date("d", strtotime("$year$valEnc$week"))+6, date("Y") ));
$dayMonth = compact("mMon","mTue","mWed","mThu","mFri","mSat","mSun");
$mon = date('j',mktime(0, 0, 0, date('m', strtotime("$modDate")), date("d", strtotime("$year$valEnc$week")), date("Y")));
$tue = date('j',mktime(0, 0, 0, date('m', strtotime("$modDate")), date("d", strtotime("$year$valEnc$week"))+1, date("Y")));
$wed = date('j',mktime(0, 0, 0, date('m', strtotime("$modDate")), date("d", strtotime("$year$valEnc$week"))+2, date("Y")));
$thu = date('j',mktime(0, 0, 0, date('m', strtotime("$modDate")), date("d", strtotime("$year$valEnc$week"))+3, date("Y")));
$fri = date('j',mktime(0, 0, 0, date('m', strtotime("$modDate")), date("d", strtotime("$year$valEnc$week"))+4, date("Y")));
$sat = date('j',mktime(0, 0, 0, date('m', strtotime("$modDate")), date("d", strtotime("$year$valEnc$week"))+5, date("Y")));
$sun = date('j',mktime(0, 0, 0, date('m', strtotime("$modDate")), date("d", strtotime("$year$valEnc$week"))+6, date("Y")));
$days = compact("mon","tue","wed","thu","fri","sat","sun");
$weekNum = date("W", strtotime("$year$valEnc$week"));
$mName = $month[($monthNum)-1];
$yearNum= $date->format('Y');
$calendar= compact("dayMonth", "days", "weekNum", "mName", "yearNum"); // $calendar['array'][value] / $calendar[value]
//print_r($calendar);
return $calendar;
}
如何从页面上的按钮指定$modification,然后重新加载函数?
Ex。增加按钮=+1周,减少按钮=-1周。
编辑:已解决
PHP:
$dMod = $_GET['mod'];
$mod = $dMod;
if ($dMod >= 0) {
$mod = '+'.$dMod.'';
}
$modification = "".$mod." week";
date_default_timezone_set ("/*TIMEZONE*/");
function calendar($modification){
$todayweek = date('W', mktime(0, 0, 0, date('m'), date("d"), date("Y") ));
$today = date('D');
$month = array("Januari","Februari","Mars","April","Maj","Juni","Juli","Augusti","September","Oktober","November","December");
$date = new DateTime(date('Y-m-d'));
$date->modify($modification);
$year = $date->format('o');
$week = $date->format('W');
if ($todayweek==$week && $today=='Fri'){
$date->modify($modification);
$year = $date->format('o');
$week = $date->format('W');
}
$fulldate = $date->format('c');
$valEnc = 'W';
$monthNum = $date->format('n');
$modDate = date('Y-m-d',strtotime($fulldate));
$fMon = mktime(0, 0, 0, date('m', strtotime("$modDate")), date("d", strtotime("$year$valEnc$week")), date("Y") );
$fTue = mktime(0, 0, 0, date('m', strtotime("$modDate")), date("d", strtotime("$year$valEnc$week"))+1, date("Y") );
$fWed = mktime(0, 0, 0, date('m', strtotime("$modDate")), date("d", strtotime("$year$valEnc$week"))+2, date("Y") );
$fThu = mktime(0, 0, 0, date('m', strtotime("$modDate")), date("d", strtotime("$year$valEnc$week"))+3, date("Y") );
$fFri = mktime(0, 0, 0, date('m', strtotime("$modDate")), date("d", strtotime("$year$valEnc$week"))+4, date("Y") );
$fSat = mktime(0, 0, 0, date('m', strtotime("$modDate")), date("d", strtotime("$year$valEnc$week"))+5, date("Y") );
$fSun = mktime(0, 0, 0, date('m', strtotime("$modDate")), date("d", strtotime("$year$valEnc$week"))+6, date("Y") );
$fulldate = compact("fMon","fTue","fWed","fThu","fFri","fSat","fSun");
$mMon = date('n', $fMon);
$mTue = date('n', $fTue);
$mWed = date('n', $fWed);
$mThu = date('n', $fThu);
$mFri = date('n', $fFri);
$mSat = date('n', $fSat);
$mSun = date('n', $fSun);
$dayMonth = compact("mMon","mTue","mWed","mThu","mFri","mSat","mSun");
$mon = date('j', $fMon);
$tue = date('j', $fTue);
$wed = date('j', $fWed);
$thu = date('j', $fThu);
$fri = date('j', $fFri);
$sat = date('j', $fSat);
$sun = date('j', $fSun);
$days = compact("mon","tue","wed","thu","fri","sat","sun");
$weekNum = date("W", strtotime("$year$valEnc$week"));
$mName = $month[($monthNum)-1];
$yearNum= $date->format('Y');
$calendar= compact("fulldate", "dayMonth", "days", "weekNum", "mName", "yearNum"); // $calendar['array'][value] / $calendar[value]
return $calendar;
}
?>
JS:
$( document ).ready(function() {
var $input = $('#calMod');
var calCheckWeek = function() {
var theDate = new Date();
if(theDate.getDay() >= 5){ //if its friday, switch to next week
if ($calMod == 0);{
$input.val(1);
};
};
};
calCheckWeek();
var $calMod = $input.val();
$('.load-div').load('/inc/calendar.php?mod=' + $calMod, function () {
if ($calMod <= 0) {
$('.calendar-prev-week').hide();
}
else {
$('.calendar-prev-week').show();
}
console.log("Calendar loaded successfully!");
});
$('.calendar-prev-week').click(function () {
var $input = $('#calMod');
var value = parseInt($input.val());
value = value - 1;
$input.val(value);
var $calMod = $input.val();
if ($calMod <= 0) {
$('.calendar-prev-week').hide();
}
else {
$('.calendar-prev-week').show();
}
$('.load-div').load('/inc/calendar.php?mod=' + $calMod, function () {
console.log("Decreased Week Number");
});
});
$('.calendar-next-week').click(function () {
var $input = $('#calMod');
var value = parseInt($input.val());
value = value + 1;
$input.val(value);
var $calMod = $input.val();
if ($calMod <= 0) {
$('.calendar-prev-week').hide();
}
else {
$('.calendar-prev-week').show();
}
$('.load-div').load('/inc/calendar.php?mod=' + $calMod, function () {
console.log("Increased Week Number");
});
});
我创建了2个按钮增加&减少周,做了一个隐藏的输入"#calMod",因为整个页面不会被刷新(我只在特定的div".loaddiv"中加载日历),所以每次我按下按钮增加或减少周时,该值都不会重置,因为我只想让它显示工作日,所以我添加了一个检查,看看它的星期五是否更多(如果(Date.getDay()>=5),如果是,当第一次加载时,它将更改为下周,您仍然可以返回一周(到当前周),但不能再返回。
现在我的"周"日历按预期工作。
下一步是选择日期并将其存储在JSon中。。感谢您的帮助和想法!
使用HTML button
元素在不重新加载页面的情况下调用PHP函数:
calendar.html
<div id="buttons_week">
<button>+1 Week</button>
<button>-1 Week</button>
</div>
<div id="calendar"></div>
<script>
// get display target
var calendar = document.getElementById('calendar');
// get buttons and loop
Array.prototype.forEach.call(document.querySelectorAll('#buttons_week button'), function (elem) {
// add function to click event
elem.addEventListener('click', function (evt) {
// set up XHR object
if ( window.XMLHttpRequest ) {
xmlhttp=new XMLHttpRequest() // IE7+, Firefox, Chrome, Opera, Safari
}
else { // IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function() {
if (xmlhttp.readyState==4 && xmlhttp.status==200) {
// here's where you handle the response you get from the PHP script
// for debugging
//calendar.innerHTML = xmlhttp.responseText
//console.log(JSON.parse(xmlhttp.responseText))
// parse JSON string from server and update calendar
var calendar_obj = JSON.parse(xmlhttp.responseText)
calendar.innerHTML = calendar_obj.weekNum + '/' + calendar_obj.mName + '/' + calendar_obj.yearNum
}
}
xmlhttp.open("GET","calendar.php?mod="+encodeURIComponent(evt.target.innerHTML),true);
xmlhttp.send();
})
})
</script>
calendar.php
<?php
echo json_encode(calendar($_GET['mod']));
function calendar($modification){
// function body here, removed for brevity
}
?>
如果你不需要去服务器上做其他事情,那么这里有一个全JavaScript版本。无需调用服务器!
JSFiddle
<div id="buttons_week">
<button>+1 Week</button>
<button>-1 Week</button>
</div>
<div id="calendar"></div>
<script>
var calendar = document.getElementById('calendar');
Array.prototype.forEach.call(document.querySelectorAll('#buttons_week button'), function (elem) {
elem.addEventListener('click', function (evt) {
var calendar_obj = week_increment(evt.target.innerHTML)
console.log(calendar_obj.days)
console.log(calendar_obj.dayMonth)
calendar.innerHTML =
calendar_obj.weekNum + '/' +
calendar_obj.mName + '/' +
calendar_obj.yearNum
})
})
function week_increment(mod) {
var dd = new Date()
var week_inc = 7 * 24 * 60 * 60 * 1000
if ( 0 === mod.indexOf('-') ) { week_inc *= -1 } // decrement week
dd = new Date(dd.getTime() + week_inc)
dd.setHours(0,0,0);
var dayMonth = [], days = [], weekNum
dd.setHours(-24 * ((dd.getDay() || 7) - 1))
for ( ii = 0; ii < 7; dd.setHours(24), ii++ ) {
days.push(dd.getDate())
dayMonth.push(dd.getMonth()+1)
if ( 3 === ii ) { // get weekNum on Thursday ??
weekNum = Math.ceil((((dd-new Date(dd.getFullYear(),0,1))/8.64e7)+1)/7) // http://stackoverflow.com/a/18005464/2743458
}
}
return {
'dayMonth': dayMonth,
'days': days,
'weekNum': weekNum,
'mName': months[dd.getMonth()],
'yearNum': dd.getFullYear()
}
}
var months = ['Januari','Februari','Mars','April','Maj','Juni','Juli','Augusti','September','Oktober','November','December'];
</script>
相关文章:
- 创建新数据和加载现有数据需要单独的视图吗
- 钛 - HTTPClient:打开新的控制器加载
- 保持 JavaScript 在浏览器控制台中运行,即使在新的页面加载之后也是如此
- 路由到新页面时加载不起作用
- 如何在新窗口完成加载后执行某些内容
- 使用新标题重新加载 html 页面
- Primefaces在打开新页面时加载数据消息
- Wordpress音频播放器和平滑状态.在新页面重新加载播放器时调用什么回调函数
- 用新数据重新加载renderer3d
- 文本不被渲染后,新的页面加载- JQuery移动
- 需要在新标签中加载pdf/doc文件,而不是下载,只是想在浏览器中阅读
- 用新参数重新加载页面
- Js和CSS不检测新页面何时加载
- 在新页面上加载一个flash视频,它在上一页上的位置
- 在新窗口中加载代码编写器视图
- 在控制台中使用新脚本重新加载页面
- 如何在加载新页面后加载AJAX数据
- 如何使用jQuery在新窗口中加载页面,然后关闭它们
- Jquery没有看到新的HTML加载到对话框中
- 无法用新值重新加载JGrid