现在的位置: 首页 > 综合 > 正文

JS实现鼠标分别点击如”上海”、”北京”、”天津” 文字,下拉框 就selected 对应的城市

2013年09月07日 ⁄ 综合 ⁄ 共 1194字 ⁄ 字号 评论关闭

方法一:

<select id="myselect">
    <option value="1">上海</option>
    <option value="2">北京</option>
    <option value="3" selected>天津</option>
  </select>
<div id="shanghai" onClick="chooseSelect(this)" value="1">上海</div><br />
<div id="beijing" onClick="chooseSelect(this)" value="2">北京</div><br />
<div id="tianjin" onClick="chooseSelect(this)" value="3">天津</div>
<script type="text/javascript">
   function chooseSelect(obj){
           document.getElementById("myselect").value=obj.value;
   }
</script>

方法二:

<div id="mydiv">
  <select id="myselect">
    <option value="上海">上海</option>
    <option value="北京">北京</option>
    <option value="天津" selected>天津</option>
  </select>
<div id="tianjin">天津</div><br />
<div id="shanghai">上海</div><br />
<div id="beijing">北京</div>
</div>
<script>
        var form,radio
        window.onload=function cha(){
       odiv=document.getElementById("mydiv");
       radio=odiv.getElementsByTagName("div");
       for(i=0;i<radio.length;i++){
            radio[i].onclick=function(){sel(this.innerHTML)}
       }
   }
   function  sel(str){//alert(str)
         var obj=document.getElementById("myselect"),j=obj.length;//alert(i)
         for (var i=0;i<j;i++){
                 if (obj.options[i].value==str){obj.options[i].selected=1;i=100}
        }
   }
</script>

抱歉!评论已关闭.