让Dropdownlist拥有Tooltip属性[通俗易懂]

让Dropdownlist拥有Tooltip属性[通俗易懂]需求:现在遇到这样一个实例:DropdowList控件占用的宽度只有100px,而数据信息占用宽度有150px以上,在不允许提高宽度的前提下我们只有通过ToolTip属性来得以扩展,方便用户识别各个选项的差异性。在这里我觉得用javascript来实现显得格外的方便.【该段为转载】代码:HTML> HEAD>  TITLE> New Document TITLE>    script 

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE使用 1年只要46元 售后保障 童叟无欺

需求:现在遇到这样一个实例:DropdowList控件占用的宽度只有100px,而数据信息占用宽度有150px以上,在不允许提高宽度的前提下我们只有通过ToolTip属性来得以扩展,方便用户识别各个选项的差异性。在这里我觉得用javascript来实现显得格外的方便.【该段为转载】

代码:

让Dropdownlist拥有Tooltip属性[通俗易懂]
<
HTML
>

让Dropdownlist拥有Tooltip属性[通俗易懂] 

<
HEAD
>

让Dropdownlist拥有Tooltip属性[通俗易懂]  

<
TITLE
>
 New Document 
</
TITLE
>

让Dropdownlist拥有Tooltip属性[通俗易懂]让Dropdownlist拥有Tooltip属性[通俗易懂]    

<
script 
language
=”javascript”
 type
=”text/javascript”
>


让Dropdownlist拥有Tooltip属性[通俗易懂]
//该脚本来自网络
让Dropdownlist拥有Tooltip属性[通俗易懂]
  function showdropitem()
让Dropdownlist拥有Tooltip属性[通俗易懂]让Dropdownlist拥有Tooltip属性[通俗易懂]        
{

让Dropdownlist拥有Tooltip属性[通俗易懂]            
var el = document.getElementsByTagName(select);
让Dropdownlist拥有Tooltip属性[通俗易懂]            
for(i=0;i<el.length;i++)
让Dropdownlist拥有Tooltip属性[通俗易懂]让Dropdownlist拥有Tooltip属性[通俗易懂]            
{

让Dropdownlist拥有Tooltip属性[通俗易懂]                
for(j=0;j<el[i].options.length;j++)
让Dropdownlist拥有Tooltip属性[通俗易懂]让Dropdownlist拥有Tooltip属性[通俗易懂]                
{

让Dropdownlist拥有Tooltip属性[通俗易懂]                    el[i].options[j].title 
= el[i].options[j].text;
让Dropdownlist拥有Tooltip属性[通俗易懂]                }

让Dropdownlist拥有Tooltip属性[通俗易懂]            }

让Dropdownlist拥有Tooltip属性[通俗易懂]        }

让Dropdownlist拥有Tooltip属性[通俗易懂]  

</
script
>

让Dropdownlist拥有Tooltip属性[通俗易懂] 

</
HEAD
>

让Dropdownlist拥有Tooltip属性[通俗易懂]

<
BODY 
onload
=”showdropitem()”
>

让Dropdownlist拥有Tooltip属性[通俗易懂]  

<
select 
name
=”selOperator”
 id
=”selOperator”
  
>

让Dropdownlist拥有Tooltip属性[通俗易懂] 

<
option 
value
=”501″
 selected
>
sina
</
option
>
           
让Dropdownlist拥有Tooltip属性[通俗易懂] 

<
option 
value
=”503″
>
sohu
</
option
>

让Dropdownlist拥有Tooltip属性[通俗易懂] 

<
option 
value
=”505″
>
yahoo
</
option
>

让Dropdownlist拥有Tooltip属性[通俗易懂] 

<
option 
value
=”510″
>
chianren
</
option
>
 
让Dropdownlist拥有Tooltip属性[通俗易懂] 

</
select
>

让Dropdownlist拥有Tooltip属性[通俗易懂] 

</
BODY
>

让Dropdownlist拥有Tooltip属性[通俗易懂]

</
HTML
>

让Dropdownlist拥有Tooltip属性[通俗易懂]
让Dropdownlist拥有Tooltip属性[通俗易懂]
让Dropdownlist拥有Tooltip属性[通俗易懂]

注意:这里给出了一个应用的例子,是HTML的应用,在ASP.net中不需要对脚本进行修改,直接移植即可;同时应该注意该段代码在IE7下是通过的,在IE6下有点问题。

该javascript脚本来自http://blog.csdn.net/tz_xiong/archive/2007/08/27/1761286.aspx

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/189190.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)
blank

相关推荐

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号