使用css定位文本区域或输入css中的有效无效

时间:2015-11-22 12:10:27

标签: html css

我输入区域的有效和无效属性但是我的重新输入密码我使用js来匹配密码,输入保持红色,我只想定位输入/ textarea并给出我自己的颜色,我试过了此代码但它更改了所有输入区域而不是重新输入。

input:focus:invalid,
textarea:focus:invalid[required][name="retypepassword"] {
    border:2px solid green;
    box-shadow:0 0 4px #F5192F;
    color:blue;
}

这是我的实际css:

textarea:focus, input:focus {
    outline: 0;
}

input:focus:invalid,
textarea:focus:invalid {
    border:2px solid #F5192F;
    box-shadow:0 0 4px #F5192F;
    color:red;
}

input:focus:valid,
textarea:focus:valid {
    border: 2px solid #09c;
    box-shadow: 0 0 4px #09c;
}

基本上我正在尝试定位重新输入密码输入和textarea? 我有这行代码可能会覆盖它吗?

   input[required]:invalid {
    background: #efdee0 url(../images/invalid.png) no-repeat center 
    right;
    }

    input[required]:valid {
    background: hsla(235, 100%, 96%, 1) url(../images/valid.png)    
    no-repeat center right;

}

1 个答案:

答案 0 :(得分:0)

js导致输入无法验证并更改为有效,因此更改为以下代码有效:

 $().ready(function(){
$("#registration").validate({
    rules: { 
        pswd: {
            required: true
        },
        retypepassword: {
            required: true,
            equalTo: "#pswd"
        }
    },
    messages: {
        pswd: "Please enter password",
        retypepassword: "Please enter valid confirm password"
    },      
    submitHandler: function() { $('#registration').submit(); }
     });
    });

最初我想要定位重新输入,因为验证不起作用,所以我可以将其更改为中性色,而不是在重新输入上添加验证。