直接上代码:


var str = "";

document.writeln("<div id=\"_contents\" tabindex=9999 onblur=\"hideSetTime()\" style=\"padding:6px; background-color:#E3E3E3; font-size: 12px; border: 1px solid #777777; position:absolute; left:?px; top:?px; width:?px; height:?px; z-index:1; visibility:hidden\">");

str += "\u65f6<select id=\"_hour\"  style='width:65px' onchange='changeHour()'>";

for (h = 0; h <= 9; h++) {

str += "<option value=\"0" + h + "\">0" + h + "</option>";

}

for (h = 10; h <= 24; h++) {

str += "<option value=\"" + h + "\">" + h + "</option>";

}

str += "</select> \u5206<select id=\"_minute\"  style='width:65px'>";

for (m = 0; m <= 9; m++) {

str += "<option value=\"0" + m + "\">0" + m + "</option>";

}

for (m = 10; m <= 59; m++) {

str += "<option value=\"" + m + "\">" + m + "</option>";

}

str += "</select> \u79d2<select id=\"_second\"  style='width:65px;display:none;'>";

for (s = 0; s <= 9; s++) {

str += "<option value=\"0" + s + "\">0" + s + "</option>";

}

for (s = 10; s <= 59; s++) {

str += "<option value=\"" + s + "\">" + s + "</option>";

}

str += "</select> <input name=\"queding\" type=\"button\" onclick=\"_select()\" value=\"\u786e\u5b9a\" style=\"font-size:12px\" /></div>";

document.writeln(str);

var _fieldname;

function _SetTime(tt) {

_fieldname = tt;

var ttop = tt.offsetTop;    //TT控件的定位点高

var thei = tt.clientHeight;    //TT控件本身的高

var tleft = tt.offsetLeft;    //TT控件的定位点宽

while (tt = tt.offsetParent) {

ttop += tt.offsetTop;

tleft += tt.offsetLeft;

}

document.getElementById("_contents").style.top = ttop + thei + 4+"px";

document.getElementById("_contents").style.left = tleft+"px";

document.getElementById("_contents").style.visibility = "visible";

document.getElementById("_contents").focus();

}

function _select() {

_fieldname.value = document.getElementById("_hour").value + ":" + document.getElementById("_minute").value;

document.getElementById("_contents").style.visibility = "hidden";

}

function hideSetTime(){

document.getElementById("_contents").style.visibility = "hidden";

}

function changeHour(){

if(document.getElementById("_hour").value==24){

_fieldname.value="24:00";

document.getElementById("_contents").style.visibility = "hidden";

}

}


问题:如果是失去焦点的时候隐藏?

解决:一般onblur事件是给form表单的input、按钮等使用,如果要给div、span、a.....等等这类标签使用的话,要加tabindex.

tabindex=9999 onblur=\"hideSetTime()\"

这样便可以在div中加onblur事件。

你是不是也遇到这种问题呢?(*^__^*) 嘻嘻……

js小时分钟控件--的更多相关文章

  1. React.js 小书 Lesson23 - dangerouslySetHTML 和 style 属性

    作者:胡子大哈 原文链接:http://huziketang.com/books/react/lesson23 转载请注明出处,保留原文链接和作者信息. 这一节我们来补充两个之前没有提到的属性,但是在 ...

  2. React.js 小书 Lesson15 - 实战分析:评论功能(二)

    作者:胡子大哈 原文链接:http://huziketang.com/books/react/lesson15 转载请注明出处,保留原文链接和作者信息. 上一节我们构建了基本的代码框架,现在开始完善其 ...

  3. React.js 小书 Lesson14 - 实战分析:评论功能(一)

    作者:胡子大哈 原文链接:http://huziketang.com/books/react/lesson14 转载请注明出处,保留原文链接和作者信息. 课程到这里大家已经掌握了 React.js 的 ...

  4. js小功能整理

    /** * 判断是否包含字符串某字符串 * @param {[type]} str [被检测的字符串] * @param {[type]} substr [检测是否含有的字符串] * @return ...

  5. [转载]Js小技巧||给input type=“password”的输入框赋默认值

    http://www.cnblogs.com/Raywang80s/archive/2012/12/06/2804459.html [转载]Js小技巧||给input type="passw ...

  6. 一些js小题(一)

    一些js小题,掌握这些对于一些常见的面试.笔试题应该很有帮助: var a=10; function aa(){ alert(a); } function bb(){ aa(); } bb();//1 ...

  7. JS数量输入控件

    JS数量输入控件 很早看到kissy首页 有数量输入控件,就随便看了下功能 感觉也不怎么难 所以也就试着自己也做了一个, 当然基本的功能和他们的一样,只是用了自己的编码思想来解决这么一个问题.特此给大 ...

  8. 用js给html控件赋值

      用js给html控件赋值 <script> window.onload=function setValue()//在页面加载时赋值 { document.getElementById( ...

  9. 第24篇 js小知识和“坑”

    前面说了说了js的相关知识,基本上除了语法外,把项目常用的知识做了一个梳理,现在说下js的其它方面的知识,这些知识不成体系,属于不理解对于一般开发没什么太多影响,但如果理解清楚,可以更好去开发. js ...

随机推荐

  1. Protobuf3 + Netty4: 在socket上传输多种类型的protobuf数据

    Protobuf序列化的字节流数据是不能自描述的,当我们通过socket把数据发送到Client时,Client必须知道发送的是什么类型的数据,才能正确的反序列化它.这严重影响限制了C/S功能的实现, ...

  2. HTTP 错误 403.14 - Forbidden Web 服务器被配置为不列出此目录的内容

    今天把一个.NET的网站部署到IIS上打开网页的时候出现了这个错误,刚开始以为是没有配置默认页,但是直接打开固定的页面地址也不行. 于是怀疑是.NET版本的问题,但是看了一下程序的目标框架是4.0没错 ...

  3. python之路1(初识python)

    python简史: python我认为特性就是简洁,灵活,高效. python重要版本: python1991年问世, python2.4:2004,同年django框架诞生. python2.6:2 ...

  4. 关于Advertising Campaign

    Advertise Campaigns 是指为了传播企业创意或者宣传主题而采取的一些列的整合营销(IMC)活动,也称为广告战役.广告战役主要在一段明确的时间内,通过不同的媒体渠道投放广告,现在经常会整 ...

  5. Java多线程总结之线程安全队列Queue

    在Java多线程应用中,队列的使用率很高,多数生产消费模型的首选数据结构就是队列.Java提供的线程安全的Queue可以分为阻塞队列和非阻塞队列,其中阻塞队列的典型例子是BlockingQueue,非 ...

  6. asp.net开发中遇到的奇葩bug及解决办法(会持续更新。。。)

    1,不知道你们遇没遇到过,在vs2010或更高版本上运行程序的时候,完全没问题,放在IIS中出现了问题,就比如左侧是菜单项,点击菜单右边显示,如果菜单链接是这样:content.aspx,而另一个链接 ...

  7. VERY DEEP CONVOLUTIONAL NETWORKS FOR LARGE-SCALE IMAGE RECOGNITION 这篇论文

    由Andrew Zisserman 教授主导的 VGG 的 ILSVRC 的大赛中的卷积神经网络取得了很好的成绩,这篇文章详细说明了网络相关事宜. 文章主要干了点什么事呢?它就是在在用卷积神经网络下, ...

  8. 关于javascript面向对象的详解!

    认识面向对象 1.面向对象中的概念 一切事物皆对象 对象具有封装和继承特性 信息隐藏 2.基本面向对象 3.函数构造器构造对象 深入了解面向对象 第一种书写格式 第二种书写格式

  9. sshfs三步走----实用(mac)

    p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 11.0px Menlo; color: #ffffff } p.p2 { margin: 0.0px 0. ...

  10. js this理解

    原文链接:http://www.ruanyifeng.com/blog/2010/04/using_this_keyword_in_javascript.html this是js语言的几个关键字,代表 ...