需要带有php变量advice的Javascript代码
我正在使用下面的脚本生成一个进度条来跟踪计时器的进度。计时器会运行一段时间，然后自动完成并删除（这是一款基于浏览器的游戏，在游戏中，你会建造一座建筑，并最终在一段时间后完成建造） 请参阅下面的代码：需要带有php变量advice的Javascript代码,javascript,php,mysql,Javascript,Php,Mysql,我正在使用下面的脚本生成一个进度条来跟踪计时器的进度。计时器会运行一段时间，然后自动完成并删除（这是一款基于浏览器的游戏，在游戏中，你会建造一座建筑，并最终在一段时间后完成建造） 请参阅下面的代码： $remaining=$item['start']+$item['duration']*60-time(); if ($remaining < 1) { $remaining='0.1'; } echo "<script type='text/javascript'> var so
$remaining=$item['start']+$item['duration']*60-time();
if ($remaining < 1) {
$remaining='0.1';
}
echo "<script type='text/javascript'>
var something = $remaining;
//<![CDATA[
$(function(){
$(document).ready(function(){
jQuery.fn.anim_progressbar = function (aOptions) {
// def values
var iCms = 1000;
var iMms = 60 * iCms;
var iHms = 3600 * iCms;
var iDms = 24 * 3600 * iCms;
// def options
var aDefOpts = {
start: new Date(), // now
finish: new Date().setTime(new Date().getTime() + something * iCms), // now + 60 sec
interval: 100
}
var aOpts = jQuery.extend(aDefOpts, aOptions);
var vPb = this;
// each progress bar
return this.each(
function() {
var iDuration = aOpts.finish - aOpts.start;
// calling original progressbar
$(vPb).children('.pbar').progressbar();
// looping process
var vInterval = setInterval(
function(){
var iLeftMs = aOpts.finish - new Date(); // left time in MS
var iElapsedMs = new Date() - aOpts.start, // elapsed time in MS
iDays = parseInt(iLeftMs / iDms), // elapsed days
iHours = parseInt((iLeftMs - (iDays * iDms)) / iHms), // elapsed hours
iMin = parseInt((iLeftMs - (iDays * iDms) - (iHours * iHms)) / iMms), // elapsed minutes
iSec = parseInt((iLeftMs - (iDays * iDms) - (iMin * iMms) - (iHours * iHms)) / iCms), // elapsed seconds
iPerc = (iElapsedMs > 0) ? iElapsedMs / iDuration * 100 : 0; // percentages
// display current positions and progress
$(vPb).children('.percent').html('<b>'+iPerc.toFixed(1)+'%</b>');
$(vPb).children('.elapsed').html(iDays+' days '+iHours+'h:'+iMin+'m:'+iSec+'s</b>');
$(vPb).children('.pbar').children('.ui-progressbar-value').css('width', iPerc+'%');
// in case of Finish
if (iPerc >= 100) {
clearInterval(vInterval);
$(vPb).children('.pbar').children('.ui-progressbar-value').css('width', 0+'%');
$(vPb).children('.percent').html('<b>0%</b>');
$(vPb).children('.elapsed').html('Building queue is empty. <div style= font-size:x-small; color:#000;>(<a href=# onclick=window.location.reload(true);>Reload?</a>)</div>');
}
} ,aOpts.interval
);
}
);
}
// default mode
$('#progress1').anim_progressbar();
// from second #5 till 15
var iNow = new Date().setTime(new Date().getTime() + 5 * 1000); // now plus 5 secs
var iEnd = new Date().setTime(new Date().getTime() + 15 * 1000); // now plus 15 secs
});
});//]]>";
$remaining=$item['start']+$item['duration']*60-time（）；
如果（$剩余<1）{
剩余$0.1'；
}
回声“
var某物=$剩余；
//0）？iElapsedMs/iDuration*100:0；//百分比
//显示当前位置和进度
$（vPb）.children（'.percent'）.html（'+iPerc.toFixed（1）+'%；
$（vPb）.children（'.appeased'）.html（iDays+'days'+iHours+'h:'+iMin+'m:'+iSec+'s'）；
$（vPb）.children（'.pbar'）.children（'.ui progressbar value'）.css（'width'，iPerc+'%'）；
//万一完工
如果（iPerc>=100）{
净空间隔（vInterval）；
$（vPb）.children（'.pbar'）.children（'.ui progressbar value'）.css（'width'，0+'%'）；
$（vPb）.children（'.percent'）.html（'0%'）；
$（vPb）.children（'.appeased'）.html（'生成队列为空。'）；
}
}，aOpts.interval
);
}
);
}
//默认模式
$（“#progress1”）.anim_progressbar（）；
//从5秒到15秒
var iNow=new Date（）.setTime（new Date（）.getTime（）+5*1000）；//现在加上5秒
var iEnd=new Date（）.setTime（new Date（）.getTime（）+15*1000）；//现在加上15秒
});
});//]]>";
编辑：仍未找到解决方案。按如下所示添加PHP变量
echo "<script type='text/javascript'>
var something = ".$remaining.";
//<![CDATA[ ...";
echo”
var something=“.剩余美元。”；
// 您可以通过添加打开和关闭标记来启动和停止PHP，如：
some html;
<?php
do some php
?>
some more html
<?php
do some php
?>
一些html；
更多的html
因此，在你的情况下：
$remaining=$item['start']+$item['duration']*60-time();
if ($remaining < 1) {
$remaining='0.1';
}
?> //STOP PHP HERE
<script type='text/javascript'>
var something = "<?php echo $remaining;?>"; //INSERT A LITTE PHP
//<![CDATA[
....
});
});//]]>; //REMOVE LAST QUOTE
$remaining=$item['start']+$item['duration']*60-time（）；
如果（$剩余<1）{
剩余$0.1'；
}
？>//在这里停止PHP
var something=“”；//插入一点PHP
//；//删除最后一个引号
您只是告诉javascript还有多少时间。您也可以解析开始时间，让anim\u progressbar函数先计算出百分比，然后再开始this.each循环
排队
start: new Date(), // now
将开始时间放在（）中，并对日期进行解析
编辑：
据我所知…Javascript日期对象将识别“开始”日期为有效日期，并相应地解析它…如果我错了，请告诉我
编辑2：
如果您没有更改代码（根据其他建议）：
$remaining=$item['start']+$item['duration']*60-time（）；
$startdate=$item['start']；//新变量
如果（$剩余<1）{
剩余$0.1'；
}
回声“
var某物=$剩余；
// 0) ? iElapsedMs/iDuration*100:0；//百分比
//显示当前位置和进度
$（vPb）.children（'.percent'）.html（'+iPerc.toFixed（1）+'%；
$（vPb）.children（'.appeased'）.html（iDays+'days'+iHours+'h:'+iMin+'m:'+iSec+'s'）；
$（vPb）.children（'.pbar'）.children（'.ui progressbar value'）.css（'width'，iPerc+'%'）；
//万一完工
如果（iPerc>=100）{
净空间隔（vInterval）；
$（vPb）.children（'.pbar'）.children（'.ui progressbar value'）.css（'width'，0+'%'）；
$（vPb）.children（'.percent'）.html（'0%'）；
$（vPb）.children（'.appeased'）.html（'生成队列为空。'）；
}
}，aOpts.interval
);
}
);
}
//默认模式
$（“#progress1”）.anim_progressbar（）；
//从5秒到15秒
var iNow=new Date（）.setTime（new Date（）.getTime（）+5*1000）；//现在加上5秒
var iEnd=new Date（）.setTime（new Date（）.getTime（）+15*1000）；//现在加15秒
});
});//]]>";
我将其更改为：start:new Date（startdate），并添加$startdate=$item['start']；作为一个更高的变量，但这会导致启动时条带100%并充满..如果这是您的意思。因此…在PHP中，在顶部$startdate=$item['start']；然后--start:new Date（'startdate），//现在已在javascript中将其定义为：var startdate=$startdate；但刚刚尝试了start:new Date（$startdate）仍然是一样的。让剩余的时间像正常一样显示，但条形图立即加载到100%。$startdate的显示方式可能有问题吗？对EDIT2的回答：这正是我所想的，我已经将所有代码复制到了适当的位置，但在开始时仍然以100%的速度显示条形图。参见图片：奇怪。。
$remaining=$item['start']+$item['duration']*60-time();
$startdate = $item['start']; // NEW VARIABLE
if ($remaining < 1) {
$remaining='0.1';
}
echo "<script type='text/javascript'>
var something = $remaining;
//<![CDATA[
$(function(){
$(document).ready(function(){
jQuery.fn.anim_progressbar = function (aOptions) {
// def values
var iCms = 1000;
var iMms = 60 * iCms;
var iHms = 3600 * iCms;
var iDms = 24 * 3600 * iCms;
// def options
var aDefOpts = {
start: new Date($startdate), // now // NEW VARIABLE
finish: new Date().setTime(new Date().getTime() + something * iCms), // now + 60 sec
interval: 100
}
var aOpts = jQuery.extend(aDefOpts, aOptions);
var vPb = this;
// each progress bar
return this.each(
function() {
var iDuration = aOpts.finish - aOpts.start;
// calling original progressbar
$(vPb).children('.pbar').progressbar();
// looping process
var vInterval = setInterval(
function(){
var iLeftMs = aOpts.finish - new Date(); // left time in MS
var iElapsedMs = new Date() - aOpts.start, // elapsed time in MS
iDays = parseInt(iLeftMs / iDms), // elapsed days
iHours = parseInt((iLeftMs - (iDays * iDms)) / iHms), // elapsed hours
iMin = parseInt((iLeftMs - (iDays * iDms) - (iHours * iHms)) / iMms), // elapsed minutes
iSec = parseInt((iLeftMs - (iDays * iDms) - (iMin * iMms) - (iHours * iHms)) / iCms), // elapsed seconds
iPerc = (iElapsedMs > 0) ? iElapsedMs / iDuration * 100 : 0; // percentages
// display current positions and progress
$(vPb).children('.percent').html('<b>'+iPerc.toFixed(1)+'%</b>');
$(vPb).children('.elapsed').html(iDays+' days '+iHours+'h:'+iMin+'m:'+iSec+'s</b>');
$(vPb).children('.pbar').children('.ui-progressbar-value').css('width', iPerc+'%');
// in case of Finish
if (iPerc >= 100) {
clearInterval(vInterval);
$(vPb).children('.pbar').children('.ui-progressbar-value').css('width', 0+'%');
$(vPb).children('.percent').html('<b>0%</b>');
$(vPb).children('.elapsed').html('Building queue is empty. <div style= font-size:x-small; color:#000;>(<a href=# onclick=window.location.reload(true);>Reload?</a>)</div>');
}
} ,aOpts.interval
);
}
);
}
// default mode
$('#progress1').anim_progressbar();
// from second #5 till 15
var iNow = new Date().setTime(new Date().getTime() + 5 * 1000); // now plus 5 secs
var iEnd = new Date().setTime(new Date().getTime() + 15 * 1000); // now plus 15 secs
});
});//]]>";