当前位置: 首页 > 图文教程 > 网页制作 > Dreamweaver > 用js封装的时间设置器

Dreamweaver
Dreamweaver打造多彩文字链接
Dreamweaver基础技巧全面接触
Dreamweaver MX 2004从零开始(4)
Dreamweaver MX 2004设计留言本实战
Dreamweaver MX 2004从零开始(5)
Dreamweaver MX 2004从零开始(6)
Dreamweaver MX 2004从零开始(7)
Dreamweaver MX 2004 打造细线表格
在DW中插入Flash的参数详解
用Dreamweaver MX建设神奇网页图片超链接
Dreamweaver中实现flash的透明背景
DreamweaverMX打造留言本(二)
DreamweaverMX打造留言本(三)
DreamweaverMX打造留言本(四)
DreamweaverMX打造留言本(五)
Dreamweaver MX技巧汇粹
DreamwaverMX与ASP.NET(一)
DreamwaverMX与ASP.NET(二)
DreamwaverMX与ASP.NET(三)
DreamwaverMX与ASP.NET(四)

Dreamweaver 中的 用js封装的时间设置器


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-11-23   浏览: 38 ::
收藏到网摘: n/a

js的成员和方法好象没有private和public之分,列一下public的成员和方法

成员:
name 控件的名字,既这个控件的变量名(必选)
fName 时间的input的name,可以后台获取,也就是input的name属性(可选,默认为 m_input

方法:
play() 使时间框呈现动态效果
getTime() 获取设定的时间

IE5.5+效果最佳,IE5运行也没有问题,就是css有些对不齐(IE5实在是太老了。。。可以退休了)

<style type="text/css">
body {
 background-color: #D4D0C8;
}
.m_frameborder {
 border-left: 2px inset #D4D0C8;
 border-top: 2px inset #D4D0C8;
 border-right: 2px inset #FFFFFF;
 border-bottom: 2px inset #FFFFFF;
 width: 100px;
 height: 19px;
 background-color: #FFFFFF;
 overflow: hidden;
 text-align: right;
 font-family: "Tahoma";
 font-size: 10px;
}
.m_arrow {
 width: 16px;
 height: 8px;
 font-family: "Webdings";
 font-size: 7px;
 line-height: 2px;
 padding-left: 2px;
 cursor: default;
}
.m_input {
 width: 18px;
 height: 14px;
 border: 0px solid black;
 font-family: "Tahoma";
 font-size: 9px;
 text-align: right;
}
</style>

<script language="javascript">
// Written by cloudchen, 2004/03/15
function minute(name,fName) {
 this.name = name;
 this.fName = fName || "m_input";
 this.timer = null;
 this.fObj = null;
 
 this.toString = function() {
  var objDate = new Date();
  var sMinute_Common = "class=\"m_input\" maxlength=\"2\" name=\""+this.fName+"\" onfocus=\""+this.name+".setFocusObj(this)\" onblur=\""+this.name+".setTime(this)\" onkeyup=\""+this.name+".prevent(this)\" onkeypress=\"if (!/[0-9]/.test(String.fromCharCode(event.keyCode)))event.keyCode=0\" onpaste=\"return false\" ondragenter=\"return false\" style=\"ime-mode:disabled\"";
  var sButton_Common = "class=\"m_arrow\" onfocus=\"this.blur()\" onmouseup=\""+this.name+".controlTime()\" disabled"
  var str = "";
  str += "<table border=\"0\" cellspacing=\"0\" cellpadding=\"0\">"
  str += "<tr>"
  str += "<td>"
  str += "<div class=\"m_frameborder\">"
  str += "<input radix=\"24\" value=\""+this.formatTime(objDate.getHours())+"\" "+sMinute_Common+">:"
  str += "<input radix=\"60\" value=\""+this.formatTime(objDate.getMinutes())+"\" "+sMinute_Common+">:"
  str += "<input radix=\"60\" value=\""+this.formatTime(objDate.getSeconds())+"\" "+sMinute_Common+">"
  str += "</div>"
  str += "</td>"
  str += "<td>"
  str += "<table border=\"0\" cellspacing=\"2\" cellpadding=\"0\">"
  str += "<tr><td><button id=\""+this.fName+"_up\" "+sButton_Common+">5</button></td></tr>"
  str += "<tr><td><button id=\""+this.fName+"_down\" "+sButton_Common+">6</button></td></tr>"
  str += "</table>"
  str += "</td>"
  str += "</tr>"
  str += "</table>"
  return str;
 }
 this.play = function() {
  this.timer = setInterval(this.name+".playback()",1000);
 }
 this.formatTime = function(sTime) {
  sTime = ("0"+sTime);
  return sTime.substr(sTime.length-2);
 }
 this.playback = function() {
  var objDate = new Date();
  var arrDate = [objDate.getHours(),objDate.getMinutes(),objDate.getSeconds()];
  var objMinute = document.getElementsByName(this.fName);
  for (var i=0;i<objMinute.length;i++) {
   objMinute[i].value = this.formatTime(arrDate[i])<