如何通過onfocusout（number_entered_by_user）事件在Javascript中傳遞“ number_entered_by_user”

Question

如何通過onfocusout(number_entered_by_user)事件在Javascript中傳遞number_entered_by_user ？

Javascript和DOM操作幾乎是全新的。 在此網站上進行了搜索，但找不到相關的答案。

我有一個<input>標記，如下所示：

<input type="number" id="txt_qu_12" onkeydown="return checkKeycode(event);" class="elementid" placeholder="" min="" max="">

我試圖更改<input>標記的有效性，如下所示：

<input type="number" id="txt_qu_12" onfocusout="myFunction(number_entered_by_user)" class="elementid" placeholder="" min="" max="">

在onfocusout事件期間，用戶輸入將傳遞給myFunction()函數以進行User Input Validation 。

其中myFunction(number_entered_by_user)定義為：

 <script> <!-- function myFunction(event) { var phoneno = event.target.value; var phoneno_templete = /^\\d{10}$/; if((phoneno.value.match(phoneno_templete)) { return true; } else { alert("Enter proper PHONE NUMBER"); return false; } } // --> </script> 

我的問題是如何通過onfocusout事件將number_entered_by_user傳遞給函數function myFunction(number_entered_by_user)

歡迎任何建議和指點。 提前致謝。

---

更新：1

根據@ randomguy04反問題，我的目標是：

• 為了正確的用戶輸入：

   //No action, simply continue 

• 對於錯誤的用戶輸入：

  生成警報為：

   alert("Enter proper PHONE NUMBER"); 

這是我的腳本：

<script>
function myFunction(event)  
{  
  var phoneno = event.target.value;
  var phoneno_templete = /^\d{10}$/;  
  if((phoneno.value.match(phoneno_templete))  
        {  
      return true;  
        }  
      else  
        {  
        alert("Enter proper PHONE NUMBER");  
        return false;  
        }  
} 
</script>

---

更新2

初始<input>標簽：

<input type="number" id="txt_qu_12" onkeydown="return checkKeycode(event);" class="elementid" placeholder="" min="" max="">

變成 ：

• 第一次嘗試 ：

   <script> <!-- function myFunction(event){ var phoneno = event.target.value; var phoneno_templete = /^\\d{10}$/; if(!phoneno.match(phoneno_templete)){ alert("Enter proper PHONE NUMBER"); } } --> </script> <input type="number" id="txt_qu_12" class="elementid" placeholder="" min="" max="" onfocusout="myFunction(event)"> 

• 第二次嘗試：

   <script> <!-- function myFunction(event){ var phoneno = event.target.value; var phoneno_templete = /^\\d{10}$/; if(!phoneno.match(phoneno_templete)){ alert("Enter proper PHONE NUMBER"); } } // --> </script> 

但是，當我用無效的輸入（11位數字）跳出時，仍然沒有顯示Alert ，如下所示：

@ randomguy04解決方案似乎是完美的，但不確定我在哪里做錯了。 有什么建議嗎？

Answer 1

您可以使用onfocusout函數上的event來訪問輸入的值

首先，您調用函數並在HTML中傳遞事件變量：

<input type="number" id="txt_qu_12" onfocusout="myFunction(event)"/>

現在，您的函數應該可以訪問event.target ，它是觸發事件的元素，在您的情況下，它將是ID為txt_qu_12的輸入

現在，您可以在javascript中訪問輸入值，例如：

function myFunction(event){  
  var phoneno = event.target.value;
  var phoneno_templete = /^\d{10}$/;  
  if(!phoneno.match(phoneno_templete)){
    alert("Enter proper PHONE NUMBER"); //this will happen if the phone number is not 10 digits in length
  }
}