There are several issue with your script. And some comments may be because I misinterpret things. But here it goes...
First off, you call timeleft as a timeout function without date argument, which means that on each timeout call of this function, mydate is undefined and mydate.split will cause errors. This is an easy error to catch if you use Firefox and keep its error console open while loading the page. After the first timeout, you get an error message there stating that "mydate is undefined", after which you'd start searching for where timeleft is called without argument.
The first time the script is run, timerID is undefined, and you still try to window.clearTimeout(timerID) which produces an error.
Secondly, I'm not sure if this will actually produce an error in any browser, but there is a possibility as I see it.
<span id="timeleft"><script type="text/javascript">document.getElementById('timeleft').innerHTML = "Is it really possible to get an element by id before the element has been created?"</script>
</span><!-- Now, after the closing tag on the other hand, the element really is created -->
The above code produces no error in FF, but you'd have to turn to the DOM spec to find out if this really is ok or not. Personally, I'd just move the script element to after the span element has been closed.
For a document.write(), the script element would have been in the correct place, but such code would only be useful before the document has finished loading.
date.getYear is deprecated and will not return what you'd expect. Use getFullYear instead.
If I interpret things correctly, $bid['createtime'] is the datetime when the bid was actually created, rather than when the bidding ends. Yet, you set the javacsript date variable "end" to $bid['createtime'], which is always earlier than now, and your script will always display "bids closed".
You never display how many hours are left.
You add 50 minutes to the minutes left for no good reason as far as I can see. Adding 20 to hours on the other hand seems like a good idea.
Script with corrections
<script type="text/javascript">
var eventtext = "Left"; // text that appears next to the time left
var endtext = "bids Closed!!"; // text that appears when the target has been reached
function timeleft(mydate){
// Split timestamp into [ Y, M, D, h, m, s ]
var t = mydate.split(/[- :]/);
// Apply each element to the Date function
var date = new Date(t[0], t[1]-1, t[2], t[3], t[4], t[5]);
// -> Wed Jun 09 2010 13:12:01 GMT+0100 (GMT Daylight Time)
/* getFullYear returns a 4-digit year, rather than 2-3 digit years
* For 2011, getYear would return 111 */
var year = date.getFullYear(); // in what year will your target be reached?
var month = date.getMonth(); // value between 0 and 11 (0=january,1=february,...,11=december)
var day = date.getDate(); // between 1 and 31
var hour =date.getHours(); // between 0 and 24
var minute = date.getMinutes(); // between 0 and 60
var second = date.getSeconds(); // between 0 and 60
/* When creating the end date, add 20 hours to create time */
var end = new Date(year,month,day,hour+20,minute,second);
/* Why add 50 to minutes? And if you want to do that, why not
* do it in the constructor on the line above? Code commented out...
end.setMinutes(end.getMinutes() + 50);
*/
var now = new Date();
/* changed from getYear with if check < 1900 */
yr = now.getFullYear();
var sec = end.getSeconds() - now.getSeconds();
var min = end.getMinutes() - now.getMinutes();
var hr = end.getHours() - now.getHours();
var dy = end.getDate() - now.getDate();
var mnth = end.getMonth() - now.getMonth();
var yr = year - yr;
var daysinmnth = 32 - new Date(now.getYear(),now.getMonth(), 32).getDate();
if(sec < 0){
sec = (sec+60)%60;
min--;
}
if(min < 0){
min = (min+60)%60;
hr--;
}
if(hr < 0){
hr = (hr+24)%24;
dy--;
}
if(dy < 0){
dy = (dy+daysinmnth)%daysinmnth;
mnth--;
}
if(mnth < 0){
mnth = (mnth+12)%12;
yr--;
}
var sectext = " Seconds ";
var mintext = " Minutes, and ";
var hrtext = " Hours, ";
var dytext = " Days, ";
var mnthtext = " Months, ";
var yrtext = " Years, ";
if (yr == 1)
yrtext = " Year, ";
if (mnth == 1)
mnthtext = " Month, ";
if (dy == 1)
dytext = " Day, ";
if (hr == 1)
hrtext = " Hour, ";
if (min == 1)
mintext = " Minute, and ";
if (sec == 1)
sectext = " second ";
if(now >= end){
document.getElementById("timeleft").innerHTML = endtext;
/* If check for when timerID is undefined (first run) */
if (timerID)
clearTimeout(timerID);
}
else{
/* added display of hours left:
hr + ':' +
*/
document.getElementById("timeleft").innerHTML = hr + ':' + min + ":" + sec;
}
/* Added creation datetime as parameter to the function call */
timerID = setTimeout("timeleft('<?php print("2011-03-18 10:30:00"); ?>')", 1000);
}
/* This would also have run the script without datetime argument when the window
* finished loading. And since you allready do call this function explicitly in
* the script element below, there's no reason to use window.onload
//window.onload = timeleft;
*/
</script>
</head>
<body style="margin: 30px;">
<p class="timer"><b>bid Closes in :</br>
<span id="timeleft">
</span></b></p></span></br></br>
<script>timeleft('<?php print("2011-03-18 10:30:00"); ?>')</script>
