Question

我正在创建一个表单并使输入字段只能使用JavaScript进行读取。我更改了只读属性的默认颜色。我想在字段为readonly i-e＆＃34; NIL＆＃34;

时显示默认值

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");;
}
});

我想添加默认值＆＃34; Nil＆＃34;如果该字段为readonly。请指导我如何将此属性添加到我的脚本。

Answer 1

要为所有元素添加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" />

Answer 2

$("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/

想通过JavaScript设置输入字段的默认值

2 个答案: