Question

使用jquery函数keyup()创建注册表单，例如，如果输入正确我将其分配给txtuname变量，然后按下注册按钮，我需要知道所有表单变量都是正确的并且已定义。下面的代码不起作用：

<script type="text/javascript">      
$("document").ready(function() {
  $("#txtuname").keyup(function() {
    if ($("#txtuname").val().length < 6) {
      jQuery("label[for='txtuname']").text("user name is too short");
    }
    if ($("#txtuname").val().length >= 6) {
      var txtuname = $("#txtuname").val();
      jQuery("label[for='txtuname']").text("");
    }
  });
  $("#submitRegistration").click(function() {
    if (typeof txtuname == 'defined') {
      alert("defined");
    }
    if (typeof txtuname == 'undefined') {
      alert("undefined");
    }
  });
});
</script>

Answer 1

修改后的代码。此代码的要点是txtuname在keyup事件列表器和click列表器的两个范围内都应该可见$。因此，如果有更多内容，请创建 验证对象 ，然后检查是否所有值都已设置且正确。是的，请在代码中使用或jQuery或$("document").ready(function(){ var txtuname = null; $("#txtuname").keyup(function(){ if($("#txtuname").val().length<6){ jQuery("label[for='txtuname']").text("user name is too short"); } if($("#txtuname").val().length>=6){ txtuname=$("#txtuname").val(); jQuery("label[for='txtuname']").text(""); } }); $("#submitRegistration").click(function(){ if( txtuname == null || txtuname.length < 6) ){ alert("incorrect"); } else{ alert("correct"); } }); });。

runOnChange=true

使用@Rhumborl的评论更新检查变量，thx

Answer 2

我会将验证逻辑放在一个函数中并调用它，您可以根据您的特定要求更新它，并且只执行一次：

function isValidName(field) {
  var myName = field.val().trim();
  // some of this is redundant but just to show possibilities
  var isValid = myName.length && myName.length >= 6 && myName && undefined !== myName && myName != " ";
  var myLabel = $("label[for='" + field.attr('id') + "']");
  if (isValid) {
    myLabel.text("");
  } else {
    myLabel.text("user name is too short");
  }
  return isValid;
}
$("document").ready(function() {
  $("#txtuname").keyup(function() {
    isValidName($(this));
  });
  $("#submitRegistration").click(function() {
    var nameIsValid = isValidName($("#txtuname"));
    if (nameIsValid) {
      alert("valid");
    } else {
      alert("undefined or invalid");
    }
  });
});

Answer 3

您在代码中使用$以及jQuery window.jQuery对象。不要同时使用两者，你可以通过两者检查

<html lang="en">
    <head>
        <title>Media Queries</title>
        <meta name="viewport" content="width=device-width, initial=scale1.0">  
        <link rel="stylesheet" href="main.css">
        <link href='https://fonts.googleapis.com/css?family=Lato:100' rel='stylesheet' type='text/css'>
        <link href='https://fonts.googleapis.com/css?family=Lato' rel='stylesheet' type='text/css'>
        <link href='https://fonts.googleapis.com/css?family=Open+Sans:700' rel='stylesheet' type='text/css'>
        <link rel="stylesheet" href="font-awesome-4.6.3/css/font-awesome.min.css">      
    </head>
    <body> 
        <i class="fa fa-car" aria-hidden="true"></i>
        <h1>
            <i class="fa fa-car" aria-hidden="true"></i>Dummy Text
        </h1>
    </body>
</html>

或者通过$ sign替换jQuery。它会起作用。

Answer 4

用以下条件替换代码 -

if( typeof txtuname !== 'undefined' && txtuname.length >= 6)  ){
  //proceed further
}else{
   alert('Please correct entries.');
   return false;
}

Answer 5

你也可以这样试试......

$("document").ready(function(){

var txtuname;

$("#txtuname").keyup(function(){
    if($("#txtuname").val().length<6){
        jQuery("label[for='txtuname']").text("user name is too short");
    }

    if($("#txtuname").val().length>=6){
        txtuname=$("#txtuname").val();
        jQuery("label[for='txtuname']").text("");
    }
});

$("#submitRegistration").click(function(){
    if(typeof txtuname=="undefined"){
        alert("undefined");
    }
    else{
        alert("defined");
    }
});
});

Jquery：检查变量是否在keyup（）函数之后定义

5 个答案: