Javascript 如果选中单选按钮,则更改字段的只读状态,无jquery
我有一个表单,我希望最初有一些普通字段和一些只读字段。然后是一个带有两个选项的单选按钮,如果它是默认选项,则不会发生任何更改,如果选择第二个选项,则只读字段将变为可编辑 我需要在没有jquery的情况下执行此操作 这是表格Javascript 如果选中单选按钮,则更改字段的只读状态,无jquery,javascript,php,Javascript,Php,我有一个表单,我希望最初有一些普通字段和一些只读字段。然后是一个带有两个选项的单选按钮,如果它是默认选项,则不会发生任何更改,如果选择第二个选项,则只读字段将变为可编辑 我需要在没有jquery的情况下执行此操作 这是表格 <form name="newstock" action="newstock-save.php" method="post"> <input type="radio" name="individual" value="1" checked> Frui
<form name="newstock" action="newstock-save.php" method="post">
<input type="radio" name="individual" value="1" checked> Fruit<br>
<input type="radio" name="individual" value="0"> Veges<br><br>
<table>
<tr>
<td>Item name</td>
<td><input type="text" name="item_name"></td>
</tr>
<tr>
<td>Packing</td>
<td><input type="text" name="packing_name" readonly></td>
</tr>
<tr>
<td>Unit</td>
<td><input type="text" name="packing_unit" readonly></td>
</tr>
</table>
水果
蔬菜
项目名称
包装
单位
请协助您可以使用以下两个选项删除元素的只读 选项1:
document.getElementById('elementId').removeAttribute('readonly');
document.getElementById('elementId').readOnly = false;
选项2:
document.getElementById('elementId').removeAttribute('readonly');
document.getElementById('elementId').readOnly = false;
更改单选按钮时使用上述任一代码
要触发单击事件,请使用属性onclick,将以下内容作为属性添加到输入元素中
onclick="callBack()"
在你的JS里面
function callBack() {
document.querySelector('input[name="individual"]:checked').value; // get the value and check it with an if condition.
}
使用document.querySelector根据可以在JavaScript中动态禁用或启用任何I/p字段的值获取所选的单选值 用于获取无线电值
document.getElementById(“input[id=‘eleid’]:checked”).value
用于启用/禁用
document.getElementById(elem).disabled = true/false
首先,在HTML中添加ID
<form name="newstock" action="newstock-save.php" method="post">
<input type="radio" name="individual" value="1" id="individual1" checked> Fruit<br>
<input type="radio" name="individual" value="0" id="individual0"> Veges<br><br>
<table>
<tr>
<td>Item name</td>
<td><input type="text" name="item_name"></td>
</tr>
<tr>
<td>Packing</td>
<td><input type="text" name="packing_name" id="packing_name" readonly></td>
</tr>
<tr>
<td>Unit</td>
<td><input type="text" name="packing_unit" id="package_unit" readonly></td>
</tr>
</table>
代码笔:当他们单击单选按钮时,我将如何触发?编辑答案。“请协助”-请显示您的尝试!本网站的目的不是为您编写代码。