Хотите установить значение по умолчанию поля ввода через JavaScript

Question

Я делаю форму и вводя поле ввода для чтения только с использованием JavaScript. Я изменяю цвет по умолчанию для атрибута только для чтения. Я хочу, чтобы отобразить значение по умолчанию, когда поле readonly т.е. «NIL»

HTML

<input type="radio" name="sex" value="male">Male<br/> 
<input type="radio" name="sex" value="female">Female <br/> 
Age:<input type="text" name="age" id="age" size="20"> 
Hobbies:<input type="text" name="hobbies" id="hobbies" size="20"><br/> 
Phone:<input type="text" name="phone" id="phone" size="20"><br/> 

JS

$("input[name='sex']").change(function() { 
if($(this).val() == "female") { 
    $("#age,#phone").attr("disabled", true).css("background-color","#0F0"); 
} else if($(this).val() == "male") { 
    $("#age,#phone").attr("disabled", false).css("background-color","#FFF");; 
} 
}); 

Я хочу, чтобы добавить значение по умолчанию «Nil», если поле readonly , Пожалуйста, расскажите мне, как добавить это свойство в мой скрипт.

Answer 1

$("input[name='sex']").change(function() { 
if($(this).val() == "female") { 
    $("#age,#phone").val('Nil'); 
    $("#age,#phone").attr("disabled", true).css("background-color","#0F0"); 

} else if($(this).val() == "male") { 
    $("#age,#phone").val(''); 
    $("#age,#phone").attr("disabled", false).css("background-color","#FFF"); 
} 
}); 

Рабочая скрипку - http://jsfiddle.net/Ashish_developer/hpee0w0d/

Answer 2

Чтобы дать все элементы с readonly приписывать значение "Nil", вы можете использовать [readonly]attribute selector так:

$('[readonly]').val('Nil');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<input type="text" readonly /> 
 
<input type="text" />

---

Вы можете сначала убедитесь, что значение вашего элемента пустое, прежде чем делать это. Чтобы сделать это, вы бы ввести filter() так:

$('[readonly]').filter(function() { 
 
    return this.value == "" 
 
}).val('Nil');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<input type="text" readonly /> 
 
<input type="text" value="Has a value" readonly /> 
 
<input type="text" />