欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

js實(shí)現(xiàn)帶有介紹的Select列表菜單實(shí)例

 更新時(shí)間:2015年08月18日 16:28:36   作者:企鵝  
這篇文章主要介紹了js實(shí)現(xiàn)帶有介紹的Select列表菜單,涉及javascript頁面元素的動(dòng)態(tài)操作技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下

本文實(shí)例講述了js實(shí)現(xiàn)帶有介紹的Select列表菜單。分享給大家供大家參考。具體如下:

帶有介紹的Select列表菜單特效代碼,并不是導(dǎo)航菜單,這是表單中常用的下拉列表菜單,里面定義的菜單名稱和鏈接都可以自己修改,不同的是添加了一個(gè)說明功能,鼠標(biāo)點(diǎn)擊列表中內(nèi)容的時(shí)候,會(huì)浮動(dòng)出本條內(nèi)容的介紹,另外文本框內(nèi)的內(nèi)容也會(huì)跟著改變。

運(yùn)行效果截圖如下:

在線演示地址如下:

http://demo.jb51.net/js/2015/js-info-select-menu-codes/

具體代碼如下:

<html>
<head>
<title>帶有說明的導(dǎo)航欄</title>
</head>
<body>
<script language="JavaScript"> 
<!--
function herfto(){
  if (document.stationform.refsel.options[0].selected){ //根據(jù)用戶選定的項(xiàng)目
    window.location.href = "http://www.dbjr.com.cn";} //改變本窗口的地址
  else if (document.stationform.refsel.options[1].selected)
  {  window.location.;}
  else if (document.stationform.refsel.options[2].selected)    
  {  window.location.;} 
  else if (document.stationform.refsel.options[3].selected)    
  {  window.location.;} 
  else if (document.stationform.refsel.options[4].selected)    
  {  window.location.;} 
  else if (document.stationform.refsel.options[5].selected)    
  {  window.location.;}  
  else if (document.stationform.refsel.options[6].selected)    
  {  window.location.;} 
 //根據(jù)可選條目,這里應(yīng)該相應(yīng)的增減。
  return true; 
  }
function textValue(){ 
  var stationInteger, stationString  
  stationInteger=document.stationform.refsel.selectedIndex //取得選定項(xiàng)目的編號(hào)
  stationString=document.stationform.refsel.options[stationInteger].title //根據(jù)編號(hào)取得相應(yīng)說明
  document.stationform.stationtext.value = stationString } //將說明顯示出來
//-->
</script>
<form name="stationform">
<select name="refsel" onChange="textValue()" multiple size="5">
<option title="一個(gè)提供優(yōu)質(zhì)腳本代碼的網(wǎng)站">腳本之家
<option title="相當(dāng)不錯(cuò)的虛擬社區(qū)">新浪sina
<option title="不用說,要搜索來這里就對了">搜狐
<option title="提供免費(fèi)個(gè)人主頁空間">網(wǎng)易163
<option title="一個(gè)優(yōu)秀的學(xué)生網(wǎng)站">世紀(jì)學(xué)苑
<option title="首創(chuàng)同學(xué)錄,中國學(xué)生的聚會(huì)場所">中國人
<option title="世界聞名的搜索巨頭">雅虎yahoo
</select>
<p>
<input type="button" name="stationbutton" value="Go!" onClick="herfto()" 
style="background-color: #FFFFFF; border: 1 solid #000000">
<p><input type="text" name="stationtext" value="" size="30" maxlength="35" style="border: 1 solid #000000">
</form>
</body>
</html>

希望本文所述對大家的javascript程序設(shè)計(jì)有所幫助。

相關(guān)文章

最新評論