首页 > 解决方案 > 未定义的输入、动态页面更改、html 中的 javascript

问题描述

当我单击注册按钮并出现输入字段时,会出现问题。当我填写时以及当代码跳转到$ (document) .on ("click", "#register_in", function () all $().val()该函数中的函数时未定义。我想Dom树有问题。谁能帮助我。

$(document).on("click", "#register_in", function() {
    var error = "";
    if ($("username").val() == "" || $("password").val() == "" || $("name").val() == "" ||
        $("lastname").val() == "" || $("jmbg").val() == "" || $("tel").val() == "" || $("email").val() == "") {
        error += "Sva polja moraju da budu popunjena";
    }

    var n = $("jmbg").length;
    if (n != 13) {
        error += "\nJMBG mora da ima 13 cifara";
    }

    $("#error1").text(error);
});



$("#register").click(function() {
    var text = "<div class=\"Centar\"><div id= \"error1\" class=\"Red\" ></div >";
    text += "Korisnicko ime: <br /> <input type=\"text\" id=\"username\" /> <br />";
    text += "Lozinka: <br /> <input type=\"password\" id=\"password\" /> <br />";
    text += "Ime:<br /> <input type=\"text\" id=\"name\" /> <br />";
    text += "Prezime:<br /> <input type=\"text\" id=\"lastname\" /> <br />";
    text += "Pol: <br /> <select id=\"pol\"><option value=\"M\">Musko</option><option value=\"Z\">Zensko</option></select><br />";
    text += "JMBG:<br /> <input type=\"text\" id=\"jmbg\" /> <br />";
    text += "Kontakt telefon:<br /> <input type=\"text\" id=\"tel\" /> <br />";
    text += "Email:<br /> <input type=\"text\" id=\"email\" /> <br />";
    text += "<input type=\"submit\" id=\"register_in\" value=\"Register\" /> </div >";
    $("#screen").html(text);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div class="Naslov">Taksi sluzba</div>
<div id="mainmanu" class="Meni">
    <table>
        <tr>
            <td name="menu" id="login">Login</td>
            <td>|</td>
            <td name="menu" id="register">Register</td>
        </tr>
    </table>
</div>

<br /><br /><br />
<div id="screen">
    <div class="Centar">
        <div id="error1" class="Red"></div>
        Korisnicko ime:<br /> <input type="text" id="username" /><br /> Lozinka:
        <br /> <input type="password" id="password" /><br />
        <input type="submit" id="log_in" value="Login" />
    </div>
</div>

标签: javascriptjqueryhtmlcssdom

解决方案


您必须在#此处设置,$("#...").val()因为它是 id 的选择器,
请参见下面的代码:

$(document).on("click", "#register_in" , function () {
   var error = "";
    if ($("#username").val() == "" || $("#password").val() == "" || $("#name").val() == "" ||
     $("#lastname").val() == "" || $("#jmbg").val() == "" || $("#tel").val() == "" || $("#email").val() == "")
      {
        error += "Sva polja moraju da budu popunjena"; 
      }

   var n = $("jmbg").length; 
   if (n != 13)
   {
error += "\nJMBG mora da ima 13 cifara";
   }

  $("#error1").text(error);
  });

                  
 $("#register").click(function () {
   var text = "<div class=\"Centar\"><div id= \"error1\" class=\"Red\" ></div >";
    text += "Korisnicko ime: <br /> <input type=\"text\" id=\"username\" /> <br />";
    text += "Lozinka: <br /> <input type=\"password\" id=\"password\" /> <br />";
    text += "Ime:<br /> <input type=\"text\" id=\"name\" /> <br />";
    text += "Prezime:<br /> <input type=\"text\" id=\"lastname\" /> <br />";
    text += "Pol: <br /> <select id=\"pol\"><option value=\"M\">Musko</option><option value=\"Z\">Zensko</option></select><br />";
    text += "JMBG:<br /> <input type=\"text\" id=\"jmbg\" /> <br />";
    text += "Kontakt telefon:<br /> <input type=\"text\" id=\"tel\" /> <br />";
    text += "Email:<br /> <input type=\"text\" id=\"email\" /> <br />";
    text += "<input type=\"submit\" id=\"register_in\" value=\"Register\" /> </div >";
    $("#screen").html(text);
                    });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
 <body>
            <div class="Naslov">Taksi sluzba</div>
            <div id="mainmanu" class="Meni">
                <table>
                    <tr>
                        <td name="menu" id="login">Login</td>
                        <td>|</td>
                        <td name="menu" id="register">Register</td>
                    </tr>
                </table>
            </div>
              
            <br /><br /><br />
            <div id="screen">
            <div class="Centar">
                  <div id="error1" class="Red"></div>
                  Korisnicko ime:<br /> <input type="text" id="username" /><br />
                  Lozinka:<br /> <input type="password" id="password" /><br />
                  <input type="submit" id="log_in" value="Login" />
            </div>
            </div>
        </body>


推荐阅读