如果輸入文字，更改輸入邊框顏色

-1

我認爲我的問題的標題很好地解釋了我需要的內容。例如我的代碼是如果輸入文字，更改輸入邊框顏色

<head> 
<style> 
input{ border: 5px solid red;} 
</style> 
</head> 
    <div class="in"> 
     <input class="input" type="text" name="text" method="post"> 
     </div>

現在邊框是紅色的。如果我在其中寫入文字，我需要將其設爲黑色。由於

來源

2016-04-28 davidxoma

請嘗試總是添加到您的問題，顯示從你身邊努力解決您的最好的代碼你自己的問題！缺點是通常你會得到你做錯的評論，在我看來這是一個很好的學習方式。 –

var inputName = document.querySelectorAll("[name=text]")[0]; 
 

 
inputName.addEventListener("input", function(){ 
 
    var hasVal = this.value.trim().length > 0 
 
    this.style.border = "5px solid "+ (hasVal? "black" : "red"); 
 
});

input{ border: 5px solid red;}

<input class="input" type="text" name="text" method="post">

以上也將返回到紅色，如果你刪除任何價值。
如果你想保持它的黑色，無論比的值長度：

var inputName = document.querySelectorAll("[name=text]")[0]; 
 

 
inputName.addEventListener("input", function(){ 
 
    this.style.border = "5px solid #000"; 
 
});

input{ border: 5px solid red;}

<input class="input" type="text" name="text" method="post">

來源

2016-04-28 22:06:28

太棒了。非常感謝你<3 – davidxoma

@davidxoma：D不客氣！ <3 –

如果輸入文字，更改輸入邊框顏色

回答

相關問題