复制代码 代码如下:
<script>
             function opts(selectObj){
                         var optDivs=document.createElement("div");
                         var objTable=document.createElement("table");
                         var objTbody=document.createElement("tbody");
                         optDivs.style.zIndex = "100";
                         objTable.style.zIndex = "100";
                         objTable.width=selectObj.style.width;    
                         objTable.border = "0";
                         objTable.cellPadding = "0";
                         objTable.cellSpacing = "0";
                         objTable.style.paddingLeft = "2";    
                         objTable.style.fontFamily = "Verdana, Arial, Helvetica, sans-serif";

                         var e = selectObj;
                         var absTop = e.offsetTop;
                         var absLeft = e.offsetLeft;
                         var absWidth = e.offsetWidth;
                         var absHeight = e.offsetHeight;

                         while(e = e.offsetParent){
                         absTop += (e.offsetTop+0.3);
                         absLeft += e.offsetLeft;
                         }

                         with (objTable.style){
                         position = "absolute";
                         top = (absTop + absHeight) + "px";
                         left = (absLeft+1) + "px";
                         border = "1px solid black";
                         tableLayout="fixed";
                         wordBreak="break-all";
                         }

                         var options = selectObj.options;
                         var val=selectObj.value;

                            if (options.length > 0){
                                 for (var i = 0; i < options.length; i++){
                                     var newOptDiv = document.createElement("td");
                                     var objRow=document.createElement("tr");
                             newOptDiv.name=options[i].value;
                             newOptDiv.innerText=options[i].innerText;
                             newOptDiv.title=options[i].title;
                             newOptDiv.onmouseout = function() {this.className='smouseOut';val=selectObj.value};
                             newOptDiv.onmouseover = function() {this.className='smouseOver';val=this.name;};
                             newOptDiv.className="smouseOut";
                             newOptDiv.style.width=40;
                             newOptDiv.style.cursor="default";
                             newOptDiv.style.fontSize = "11px";
                             newOptDiv.style.fontFamily = "Verdana, Arial, Helvetica, sans-serif";

                             objRow.appendChild(newOptDiv);
                             objTbody.appendChild(objRow);
                             }
                            }

                    
                            objTbody.appendChild(objRow);
                            objTable.appendChild(objTbody);
                            optDivs.appendChild(objTable);
                            document.body.appendChild(optDivs);

                             var IfrRef = document.createElement("div");
                            IfrRef.style.position="absolute";
                            IfrRef.style.width = objTable.offsetWidth;
                            IfrRef.style.height = objTable.offsetHeight;
                            IfrRef.style.top = objTable.style.top;
                            IfrRef.style.left = objTable.style.left;
                            IfrRef.style.backgroundColor = document.bgColor;
                            document.body.appendChild(IfrRef);

                            objTable.focus();
                            objTable.onblur=function() {choose(selectObj,val,optDivs,IfrRef)};
         }

         function choose(objselect,val,delobj,delobj2){
             objselect.value=val;
             document.body.removeChild(delobj);
             document.body.removeChild(delobj2);
         }

         </script>

        
         <STYLE>
                    .smouseOut {
                            background: document.bgColor;
                            color: #000000;
                    }
                    .smouseOver {
                            background: rgb(0,128,128);
                            color: #FFFFFF;
                            cursor: pointer;
                    }
            </style>

        
         <select id='selId'    style='width:50px' class='black' onclick="opts(this);">
                <option value='1' title="One....">111</option>
                <option value='2' title="Two....">222</option>

            </select>
标签:
select,title,提示属性

免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件! 如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com
桃源资源网 Design By www.nqtax.com

评论“js下用层来实现select的title提示属性”

暂无“js下用层来实现select的title提示属性”评论...

《魔兽世界》大逃杀!60人新游玩模式《强袭风暴》3月21日上线

暴雪近日发布了《魔兽世界》10.2.6 更新内容,新游玩模式《强袭风暴》即将于3月21 日在亚服上线,届时玩家将前往阿拉希高地展开一场 60 人大逃杀对战。

艾泽拉斯的冒险者已经征服了艾泽拉斯的大地及遥远的彼岸。他们在对抗世界上最致命的敌人时展现出过人的手腕,并且成功阻止终结宇宙等级的威胁。当他们在为即将于《魔兽世界》资料片《地心之战》中来袭的萨拉塔斯势力做战斗准备时,他们还需要在熟悉的阿拉希高地面对一个全新的敌人──那就是彼此。在《巨龙崛起》10.2.6 更新的《强袭风暴》中,玩家将会进入一个全新的海盗主题大逃杀式限时活动,其中包含极高的风险和史诗级的奖励。

《强袭风暴》不是普通的战场,作为一个独立于主游戏之外的活动,玩家可以用大逃杀的风格来体验《魔兽世界》,不分职业、不分装备(除了你在赛局中捡到的),光是技巧和战略的强弱之分就能决定出谁才是能坚持到最后的赢家。本次活动将会开放单人和双人模式,玩家在加入海盗主题的预赛大厅区域前,可以从强袭风暴角色画面新增好友。游玩游戏将可以累计名望轨迹,《巨龙崛起》和《魔兽世界:巫妖王之怒 经典版》的玩家都可以获得奖励。