無法獲得輸入字段的值JS

我對JS和HTML非常陌生，所以我很抱歉。我嘗試使用pattern =''屬性驗證表單字段的輸入時遇到了麻煩。雖然它會捕獲無效輸入並提供相應的錯誤消息，但後續輸入修改不會更改錯誤消息。例如，無法獲得輸入字段的值JS

pattern="[a-zA-Z]"將生成適當的消息，如果用戶在該字段中輸入「testing2」。但是，如果用戶將條目編輯爲「測試」，我仍然會收到驗證錯誤。

在試圖解決這個問題時，我試圖將輸入欄輸入到控制檯。所以，在HTML：

<input class="dest_one_key" name="dest_one_key" type="text" id="dest_one_key" required="" placeholder="Work">

然後：

<script> var v = document.getElementById('dest_one_key').value; document.getElementById('dest_one_key').addEventListener('change', function() { console.log(價值：$ {V} ); }); </script>

...這yeilds

「值：」

在控制檯中。所以表單似乎並沒有捕獲用戶的輸入。

我在做什麼錯了： 1）無法正確註冊用戶有效輸入後輸入無效 2）記錄該字段的值到控制檯？

來源

2017-10-14 sarkon

我想你想要的東西了這樣的事：https://stackoverflow.com/questions/20287650/html5-input-validate-letters-and-numbers?answertab =活動 – jgatjens

下面是一個簡單的例子： https://jsbin.com/natociy/2/edit?html,js,console,output – jgatjens

是的！這解決了接受用戶編輯頁面的問題。（我搜遍了整個地方，這從來沒有提到的正則表達式）。爲什麼我會遇到問題2）？ – sarkon

由於您的腳本只運行一次，因此v變量將爲空。你需要在你的活動中使用event.target.value來改變它。就像這樣：

var v; 
 

 
document.getElementById('dest_one_key').addEventListener('change', function(event) { 
 
    v = event.target.value; 
 
    console.log('Value: ' + v); 
 
});

<input class="dest_one_key" name="dest_one_key" type="text" id="dest_one_key" required="" placeholder="Work">

來源

2017-10-14 21:09:22 lankovova

無法獲得輸入字段的值JS

回答

相關問題