輸入值undefined javascript

我想在提交文本框爲空時顯示錯誤消息，但不工作，每次嘗試通過控制檯區域獲取值都會返回undefined。輸入值undefined javascript

CSS

<style> 
    #error_alert { 
     visibility: hidden; 
     border: 1px solid #F00; 
     text-align: center; 
     width: 100px; 
    } 

    label, 
    input, 
    button { 
     display: block; 
     margin: 2px; 
    } 
</style>

的Javascript

<script> 
    function validate() { 
     var inputName = document.getElementsByName("fName") 
     if (inputName.value == " ") { 
      document.getElementById("error_alert").style.visibility = "visible"; 
     } 
    } 
    </script>

的Html

<body> 
    <h1>Titulo</h1> 
    <p id="error_alert">invalid name</p> 
    <label>Name:</label> 
    <input type="text" name="fName" /> 
    <label>e-mail:</label> 
    <input type="email"> 
    <button onClick="validate()" type="button">Enviar</button> 
</body>

PS：當我加入x == null ||作爲條件的opntion消息甚至會變成可見每次當我有寫在textarea上的東西。

來源

2015-06-11 Kiogara

['getElementsByName（）']（https://developer.mozilla.org/en-US/docs/Web/API/Document/getElementsByName）返回一個類似數組的對象，而不是單個元素。 – Teemu

@Teemu正確.. @OP也是'「」'不是空白狀態，而是'「」'這是。 – vinayakj

它的getElementsByName所以你得到DOM元素s的列表，你需要選擇一個特定的列表。

function validate() { 
 
     var inputName = document.getElementsByName("fName")[0]; 
 
     if (inputName.value == "") { 
 
      document.getElementById("error_alert").style.visibility = "visible"; 
 
     } 
 
    }

#error_alert { 
 
     visibility: hidden; 
 
     border: 1px solid #F00; 
 
     text-align: center; 
 
     width: 100px; 
 
    } 
 

 
    label, 
 
    input, 
 
    button { 
 
     display: block; 
 
     margin: 2px; 
 
    }

<h1>Titulo</h1> 
 
    <p id="error_alert">invalid name</p> 
 
    <label>Name:</label> 
 
    <input type="text" name="fName" /> 
 
    <label>e-mail:</label> 
 
    <input type="email"> 
 
    <button onClick="validate()" type="button">Enviar</button>

來源

2015-06-11 18:50:03 vinayakj

getElementsByName()返回一個數組，所以你比較" "是無效的。如果您也向輸入添加了一個ID，那將更容易，那麼您可以使用getElementById()來代替。它返回一個單一的值，然後你就可以與之比較。

<input type="text" name="fName" id="fName" /> 

var inputName = document.getElementById("fName");

來源

2015-06-11 18:50:55 Tricky12

變化：

if (inputName.value == " ") {

到：

if (inputName.value[0] == "") {

來源

2015-06-11 18:51:03 Luke

When you use document.getElementsByName, it returns an array, hence input.value will not work. 

Try the following - 
function validate() { 
    var inputName = document.getElementsByName("fName") 
     if (inputName[0].value == "") { 
      document.getElementById("error_alert").style.visibility = "visible"; 
     } 
    } 
}

來源

2015-06-11 18:51:12

輸入值undefined javascript

回答

相關問題