文本和属性 radio,checkbox,select

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="../scripts/jquery-1.7.2.js"></script>
<script type="text/javascript">
$(function(){
    
    /* 文本 */
    //var value = $("#bj").text();
    //var value = $("#bj").val();
    $("#bj").text("bb");
    
    
    /* 属性 */
    //var value = $(":text[name='username']").val();//直接val获取值
    //var value = $(":text[name='username']").attr("value");
    //attr('','') 赋值 
    //var value = $(":text[name='username']").attr("value","value");
    
    //checkbox
    var value = $(":checkbox:checked").each(function(){
        //alert(this.value);
    });
    //radio
    var value = $(":radio:checked").each(function(){
        //alert(this.value);
    });
    
    var value = $(":radio[name='gender']:checked").each(function(){
        //alert(this.value);
    });
    
    //select  注意加个空格
    var value = $("select :selected").each(function(){
        alert(this.value);
    });
});

</script>
</head>
    <body>
        <p>你喜欢哪个城市?</p>
        <ul id="city"><li id="bj" name="BeiJing" >北京</li>
            <li>上海</li>
            <li id="dj">东京</li>
            <li id="se">首尔</li>
        </ul>
        
        <br><br>
        <p>你喜欢哪款单机游戏?</p>
        <ul id="game">
            <li id="rl">红警</li>
            <li>实况</li>
            <li>极品飞车</li>
            <li>魔兽</li>
        </ul>
        
        <br><br>
        gender: 
            <input type="radio" name="gender" value="male2" />Male
            <input type="radio" name="gender" value="female2"/>Female
            
            
            <input type="checkbox" name="gender1" value="male1" />Male
            <input type="checkbox" name="gender1" value="female1"/>Female
    
        下拉列表1: <br>
            <select name="test" multiple="multiple" style="height: 100px">
                <option>浙江</option>
                <option selected="selected">辽宁</option>
                <option>北京</option>
                <option selected="selected">天津</option>
                <option>广州</option>
                <option>湖北</option>
            </select>
    
        <br><br>
        name: <input type="text" name="username" value="atguigu"/>
        
    </body>
</html>

 

posted @ 2018-04-13 08:47  aLa神灯  阅读(151)  评论(0编辑  收藏  举报