在事件方法中調用JS函數

Question

我希望我不要重復一個問題，但是我已經四處搜尋並且找不到幫助，所以我想我應該直接問一下，我仍然是初學者，這是我課堂上的作業，所以請盡可能詳盡

我正在嘗試創建一個表單，當用戶單擊另一個字段時，它會檢查他在第一個字段中輸入的內容是否符合網站的要求，而不必單擊回車或提交按鈕。

這是HTML文件。

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="test.js"></script>  
<script>

$(document).ready(function(){
    $("div.ID").focusin(function(){
        $(this).css("background-color", "#FFFFCC");
    });
    $("div.ID").focusout(function(){
        $(this).css("background-color", "#FFFFFF");
        userid_validation(userid,5,12);

    });
});
</script>
</head>
<body>

<div class="ID" >
  User ID: <input type="text" name="userid" size="12" />
 </div>

 <div class="pass">
 Password: <input type="text" name="psw" size="12" />
 </div>

</body>
</html>

這是JS文件

function userid_validation(userid,mx,my)  
{  
var uid_len = userid.value.length;  

if (uid_len == 0 || uid_len >= my || uid_len < mx)  
{  

alert("User Id should not be empty / length be between "+mx+" to "+my);  

//uid.focus();  
return false;  
}  

return true;  
}

我很可能在做完全錯誤的事情，但我不知道該怎么辦。 提前致謝！

Answer 1

您需要在輸入元素上應用focusin和foucsout 。 目前，您已將它應用於div 。 另外，在調用以下函數時，您還會遇到代碼錯誤，

userid_validation(userid, 5, 12); // userid not defined.

請檢查是否可行。

 function userid_validation(userid, min, max) { var uid_len = userid.length; if (uid_len == 0 || uid_len > max || uid_len < min) { alert("User Id should not be empty / length be between " + min+ " to " + max); //uid.focus(); return false; } return true; }

 <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="test.js"></script> <script> $(document).ready(function() { $("div.ID").find('input').focusin(function() { $(this).css("background-color", "#FFFFCC"); }); $("div.ID").find('input').focusout(function() { $(this).css("background-color", "#FFFFFF"); userid_validation($(this).val(), 5, 12); }); }); </script> </head> <body> <div class="ID"> User ID: <input type="text" name="userid" size="12" /> </div> <div class="pass"> Password: <input type="text" name="psw" size="12" /> </div> </body> </html>

在事件方法中調用JS函數

問題描述

1 個解決方案

解決方案1
1 已采納 2016-12-20 13:30:33

在事件方法中調用JS函數

問題描述

1 個解決方案

解決方案1 1 已采納 2016-12-20 13:30:33

解決方案1
1 已采納 2016-12-20 13:30:33