检查输入值并添加类与jQuery

Question

我想创建一些简单的输入验证。 如果输入的值为“abc”，我想为输入添加一个红色类，并将文本颜色更改为红色。 不知何故，我想停止提交表格。

这是到目前为止我的代码：

$(document).ready(function() { 
    $('#inputname').click(function() { 
     if ($("#inputname").val('abc') { 
      $("#inputname").addClass(red); 
     } else { 
      $("#inputname").removeClass(red); 
     } 
     }); 
    }); 

HTML：

<input type="text" value="abc" name="inputname" id="inputname" class="inputname" 
    onblur="if (this.value == ``) {this.value = `abc`;}" 
    onfocus="if (this.value == `abc`) {this.value = ``;}" /> 

CSS：

.red { color: #FF0000;} 

的jsfiddle： https://jsfiddle.net/n5x4q0bp/

Answer 1

$(document).ready(function() { 
 
    $('#inputname').focusout(function() { 
 
    if ($("#inputname").val() == 'abc') { 
 
     $("#inputname").addClass('red'); 
 
     $('#submit_button').attr('onclick', 'return false;'); 
 

 
    } else { 
 
     $("#inputname").removeClass('red'); 
 
     $('#submit_button').removeAttr('onclick'); 
 
    } 
 
    }); 
 
});

<input type="text" value="" name="inputname" id="inputname" class="inputname" onblur="if (this.value == '') {this.value = 'abc';}" onfocus="if (this.value == 'abc') {this.value = '';}" /> 
 
<input type="submit" id="submit_button" />

Answer 2

.VAL（）是一个方法来设定价值。你需要得到的电流值，并检查它

 if ($("#inputname").val()=='abc') { 
     $("#inputname").addClass('red'); 
    } else { 
     $("#inputname").removeClass('red'); 
    } 

Answer 3

这里是正在运行的代码

$(document).ready(function() { 

    $('#inputname').focusout(function() { 

     if ($("#inputname").val()=="abc") { 
      alert("value"); 
      $("#inputname").css("color", "RED"); 

     } else { 
      $("#inputname").css("color", "black"); 
      // your form submit code here 
     } 
     }); 


    });