html表单中的输入字符需要匹配 - jQuery？答案

【问题标题】：Type input characters in html form need match - jQuery?html表单中的输入字符需要匹配 - jQuery？
【发布时间】：2016-10-11 18:33:22
【问题描述】：

如何在 HTML 文本框中键入内容，如果前 3 个字符与设置的变量不匹配 - 然后显示错误？我需要丢失错误并在第三个字符之后的输入旁边显示文本

我在考虑 jQuery、AJAX、PHP - 不确定。我只是不想使用警告框。

这需要在用户输入提交按钮之前...

<form>
    <input type="text" id="test"/><br>
    <input type="button" id="txt" value="Submit" />
</form>

$(document).ready(function(){
    $("#txt").click(function(){
        var text = $("#test").val();
        var comparingText = "yes";

        if (text != comparingText){
            alert( $("#test").val());
        }
    });
});

【问题讨论】：

你在问你应该使用什么技术？

标签： php jquery html ajax forms

【解决方案1】：

写yes后会显示这个提示。你可以随心所欲地使用它。

$( "#test" ).keyup(function() {
    var test = $( "#test" ).val();
    if(test == 'yes'){
      alert( "your Error msg" );
   }
 });

【讨论】：

【解决方案2】：

您可以在<input> 元素旁边使用<span> 元素来显示错误消息，并且如您所说，避免使用警告框。

HTML

<form>
    <input type="text" id="test" oninput="submitData(this.value)"/> 
    <span id="textError"></span><br/>
    <input type="button" id="txt" value="Submit" />
</form>

function submitData(input) {        
    if (input != "yes") {
        document.getElementById("textError").innerHTML = "Your Error MSG";  
    } else {
        document.getElementById("textError").innerHTML = "";    
    }
}

JS + jQuery

在这种情况下，我将采用Mamunur Rashid 的答案来补充代码。

HTML

<form>
    <input type="text" id="test"/> <span id="textError"></span><br/>
    <input type="button" id="txt" value="Submit" />
</form>

jQuery

$(document).ready(function(){
    $("#test").keyup(function(){
        var test = $("#test").val();
        if (test != "yes") {
            $("#textError").html("Your Error MSG"); 
        } else {
            $("#textError").html("");   
        }
    });
});

【讨论】：