Question

这是在我的jsp文件中：

<paper-input-decorator  floatingLabel label="Username" Id="textfield" >
    <input type="text" name="user" Id="user">
</paper-input-decorator>

<paper-input-decorator floatingLabel label="Password">
    <input type="password" name="pass" Id="pass">  
</paper-input-decorator><br>

这是我在javascript文件中的功能（由纸质按钮触发）

function autenticate(){

    var user = document.getElementById("user").value;
    var user1= document.getElementById("user");


    var passw = document.getElementById("pass").value;  
    var passw1 = document.getElementById("pass");

    if(user.length<1){

    }else{ 
        document.login.submit(); 
    }

如果user.length为＆lt; 1，我想用红色标记用户的标签和下划线（纸张输入装饰器）。我该怎么做？

Answer 1

困难的方法是创建一个CSS类并将其分配如下：

<强> CSS

paper-input-decorator.red-label /deep/ .label-text {
 color:red;
}

<强> JS

var authenticate = function() {
 var user = document.getElementById("user");

 if(user.value.length < 1) {
  user.parentNode.classList.add("red-label");
 } else {
  user.parentNode.classList.remove("red-label");
 }
}

简单的方法就是使用纸张输入的自动验证选项，例如：

<paper-input-decorator label="required" floatinglabel error="input is required!" autovalidate layout vertical class="invalid">
      <input is="core-input" required="" placeholder="required>
    </paper-input-decorator>

如何在javascript中更改聚合物的纸张输入装饰器标签颜色和下划线？

1 个答案: