Select option ile text' in plavce holder' ını nasıl değiştirebilirim?
<select name="tel" id="telcode">
<option value="TR" selected>Türkiye (+90)</option>
<option value="US">United States (+1)</option>
<option value="UK">United Kingdom (+44)</option>
<option value="JP">Japan (+81)</option>
</select>
<input type="tel" class="form-control" id="inputTel" placeholder="+90" pattern="[0-9]{3}-[0-9]{3}-[0-9]{2}-[0-9]{2}">
bu şekilde bir telefon numarası girme formu yapıyorum ve palaceholder kısmında yazan "+90" yazısını telefon kodu değiştirildiğinde text de olan placeholder kısmınında değişmesini isityorum.
Soru hatalı mı? 👎
Eğer sorunun kurallara aykırı olduğunu düşünüyorsanız lütfen bize bildirin!
Cevaplar (3)
Javascript ile yapabilirsiniz.
var $telcode = document.getElementById("telcode");
var $input = document.getElementById("inputTel");
var placeholderValues = { TR: "+90", US: "+1", UK: "+44", Japan: "+81" };
$telcode.addEventListener("change",function(e) {
var targetValue = placeholderValues[e.target.value];
$input.placeholder = targetValue ? targetValue : "?";
});
<!DOCTYPE html>
<html>
<body>
First Name: <input type="text" id="myText" placeholder="Name">
<p>Click the button to change the placeholder text of the text field.</p>
<button onclick="myFunction()">Try it</button>
<script>
function myFunction() {
document.getElementById("myText").placeholder = "Type name here..";
}
</script>
</body>
</html>
const selects = document.getElementById("telcode"),
inputs = document.getElementById("inputTel");
selects.addEventListener("change",(e) =>
(
inputs.placeholder = e.target.options[e.target.options.selectedIndex]
.innerText.match(/([0-9+]+)/ig)
)
)
dene bunu