jquery实现select中option列表,选择其中一个option则显示对应div内容

 我来答
小花猫等你宠28
2017-08-25
知道答主
回答量:26
采纳率:0%
帮助的人:9.3万
展开全部

题目说的不太清楚,是不是下面的效果?

首先引用jquery

<script type="text/javascript" src="jquery.js"></script>

js代码

function chselect()
        {
            var val = $("#s1").val();
            $("#option div").hide();
            $("#" + val + "").show();
        }

html代码

<div>

        <select id="s1" onchange="chselect()">
            <option value="option1">option1显示</option>
            <option value="option2">option2显示</option>
            <option value="option3">option3显示</option>
        </select>
    </div>

   <div id="option">
       <div id="option1">我是option1</div>
       <div id="option2" style="display:none">我是option2</div>
       <div id="option3" style="display:none">我是option3</div>
   </div>
匿名用户
2017-05-05
展开全部
<select id="s1">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<div id="div1">1</div>
<div id="div2" style="display:none">2</div>
<div id="div3" style="display:none">3</div>
<script type="text/javascript">	
$(document).ready(function(){
$("#s1").change(function(){
var item = $(this).val();
$("div").hide();
$("#div"+item).show();
});
});
</script>
本回答被网友采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
哦_廿一
2017-08-22 · TA获得超过431个赞
知道小有建树答主
回答量:273
采纳率:91%
帮助的人:216万
展开全部
可以使用bootstrap来实现你要的效果。
地址:http://www.runoob.com/bootstrap/bootstrap-tab-plugin.html
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
匿名用户
2017-08-24
展开全部
测试无效,是不是需要加载jq?
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
匿名用户
2017-05-05
展开全部
你这问题问的
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 2条折叠回答
收起 更多回答(3)
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式