美文网首页
二级联动测试

二级联动测试

作者: 小进我是爸爸 | 来源:发表于2020-04-06 14:02 被阅读0次
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js">
</script>

</head>
<body>
 
 <select id="name1">
    <option>请选择</option>
    <option>北京</option>
    <option>杭州</option>
    <option>上海</option>
 </select>
 
 <select id="name2">
    <option>请选择</option>
    <option>北京1</option>
    <option>北京2</option>
    <option>北京3</option>
     
 </select>
 <select id="name3">
    <option>请选择</option>
    <option>杭州1</option>
    <option>杭州2</option>
    <option>杭州3</option>
     
 </select>
  <select id="name4">
    <option>请选择</option>
    <option>上海1</option>
    <option>上海2</option>
    <option>上海3</option>
     
 </select>
<script>
 
 $('#name1').change(function(){
    var a=parseInt($(this).find('option:selected').index())+1;
    var namenum="#name"+a;
    alert(namenum);
    $('#name4,#name3,#name2').css('display','none');
    $(namenum).css('display','block');
    $(namenum).attr('name','name');
 })
</script>
</body>
</html>

相关文章

网友评论

      本文标题:二级联动测试

      本文链接:https://www.haomeiwen.com/subject/ajfbphtx.html