三种用于select 的选择器

最新推荐文章于 2025-01-21 09:36:24 发布

weixin_30817749

最新推荐文章于 2025-01-21 09:36:24 发布

阅读量216

点赞数

原文链接：http://www.cnblogs.com/zc123/p/5408393.html

版权

<html lang="en">
<head>
    <meta charset="utf-8">
    <title>选项卡默认值</title>
<style>

</style>
<script src="http://lib.sinaapp.com/js/jquery/1.9.1/jquery-1.9.1.min.js"></script>

</head>
<body>

<select name="sel" id="selectstation">
    <option value="1" id='first_options'>苹果</option>
    <option value="2">西瓜</option>
    <option value="3">无花果</option>
    <option value="4">艾叶果</option>
    <option value="5">清果</option>
</select>

<h2>兄弟选择器 ~ </h2>
<input type="button" id="brother" value='兄弟选择器' />
<h2>就近选择器 + </h2>
<input type="button" id="next" value='就近选择器' />
<h2>子代选择器 > </h2>
<input type="button" id="child" value='子代选择器' />
</body>
<script>
    $("#brother").click(function(){
        var second = $('#first_options ~ option').val();
        alert(second);
    });
    $('#next').click(function(){
        var three = $('#first_options + option').val();
        alert(three);
    });
    $('#child').click(function(){
        str = '';
        $('#selectstation  option').each(function(i){
            str += $('#selectstation option:eq('+i+')').text()+',';
        });
        alert(str);

    });
    
</script>
</html>