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>

Correcting teacher：

天蓬老师

Correction status：qualified

Teacher's comments：表单是用户与网站交互的重要工具, 也是危险的来源, 要当心

Statement of this Website

The copyright of this blog article belongs to the blogger. Please specify the address when reprinting! If there is any infringement or violation of the law, please contact admin@php.cn Report processing!

All comments Speak rationally on civilized internet, please comply with News Comment Service Agreement

0 comments

Author's latest blog post

HTML基础标签的学习- PHP九期线上班

2019-10-30 19:26:37