jquery表单对象属性选择器

<body>
<div class="div2" >[attribute='value']：选择具有指定属性且属性值为指定值的元素</div>
<div class="div3" style="background: rebeccapurple;">[attribute*='value']：选择具有指定属性且属性值包含指定字符串的元素。</div>
<div class="div5" style="text-align: center;">[attribute$='value']：选择具有指定属性且属性值以指定字符串结尾的元素。</div>
<div class="div6">[attribute!='value']：选择没有指定属性的元素，或者具有指定元素但属性值不是指定值的元素</div>
<div class="div7">[attribute^='value']：选择具有指定属性且属性值以指定字符串开头的元素。</div>
<p >注册新用户</p>
<div>
<label for="email">注册邮箱</label>
<input type="email" id="email" name="email" placeholder="需要通过邮件激活账户">
</div>
<div>
<label>用户名称</label>
<input type="text" id="username" name="username" placeholder="不少于4个字符">
</div>
<div>
<label>显示昵称</label>
    <input type="text" id="nickname" name="nickname" placeholder="不少于2个字符">
</div>
    <label >用户密码</label>
    <input type="password" id="paw" name="paw" value="" placeholder="至少 8位"><br>
    <label >确认密码</label>
    <input type="password" id="paw1" name="paw1" value="" placeholder="请确认密码">
</div>
<div>
    <p >兴趣爱好：</p>
    <input type="checkbox" id="ch1" value="0">唱歌
    <input type="checkbox" id="ch2" value="1">跳舞
    <input type="checkbox" id="ch3" value="2">玩游戏
    <input type="checkbox" id="ch4" value="3">运动
</div>
<div>
    <label >来自哪里</label>
    <select name="region" id="place">
        <option  value="sc">四川</option>
        <option selected value="gd">广东</option>
        <option value="cq">重庆</option>
    </select>
</div>
<div>
    <label>性别</label>
    <input type="radio" name="sex" value="1" checked>男
    <input type="radio" name="sex" value="0">女
</div>
<button type="button" onclick="save()">提交保存</button>
<script>
    function save() {
        var mail=$('input[type="email"]').val();
        var user=$('input[id="username"]').val();
        var nickname=$('input[id="nickname"]').val();
        var pass=$('input[id="paw"]').val();
        var pass2=$('input[id="paw1"]').val();
        var  sel=$('select option:selected').text();
        var sex=$('input[type="radio"]').val();
        // 判断邮件格式
        if (mail.search('@')==-1 || mail.search('.com')==-1){
            alert('邮件填写不正确');
            return;
        }
        // 判断用户名称
        if (user==''||user.length<4){
            alert('用户名称不能少于4个字符');
            return;
        }
        // 判断用户昵称是否少于2个字符串
        if (nickname==''||nickname.length<2){
            alert('显示昵称不能少于2个字符');
            return;
        }
        // 判断用户密码
        if (pass==''||pass.length<8){
            alert('密码不能少于8个字符');
            return;
        }
        if (pass!=pass2){
            alert('两次密码不一样');
            return;
        }
        if(sex==undefined){
            alert('请选择性别');
            return;
        }
    }
    // 选择具有指定属性且属性值为指定值的元素
     var mydiv=$('div[class="div2"]');
             console.log(mydiv);
    // 选择具有指定属性且属性值包含指定字符串的元素。
             mydiv=$('div[style*="back"]');
    console.log(mydiv);
    // 选择具有指定属性且属性值以指定字符串结尾的元素。
        mydiv=$('div[style$="center;"]');
    console.log(mydiv);
    // 选择属性值不是指定值的元素
    mydiv=$('div[class!="div6"]');
    console.log(mydiv);
    // 选择具有指定属性且属性值以指定字符串开头的元素
    mydiv=$('div[style^="text"]');
    console.log(mydiv);
</script>
</body>
jquery表单对象属性选择器--php培训九期线上班

jquery表单对象属性选择器

相关文章
