当单击编辑
并显示标签
并隐藏时,如何隐藏标签
并显示输入
单击取消
时的输入
?
<label class="lblProfile">First Name: </label>
<label class="ansProfile">${resident.firstname}</label>
<input id="firstname"name="firstname" type="text" placeholder="${resident.firstname}"/>
<a> Edit </a>
<a> Cancel </a>
谁能告诉我如何编码?
最佳答案
像下面这样的东西应该可以解决问题。
function showhide(which){
var edit = document.getElementById('edit');
var cancel = document.getElementById('cancel');
var input = document.getElementById('firstname');
var label = document.getElementsByClassName('ansProfile')[0];
if(which==='edit'){
if(edit.checked){
cancel.checked=false;
label.style.display='none';
input.style.display='inline';
}else{
label.style.display='inline';
}
}else{
if(cancel.checked){
edit.checked=false;
label.style.display='inline';
input.style.display='none';
}else{
input.style.display='inline';
}
}
}
<label class="lblProfile">First Name: </label>
<label class="ansProfile">${resident.firstname}</label>
<input id="firstname"name="firstname" type="text" placeholder="${resident.firstname}"/>
<input id='edit' type='checkbox' onClick='showhide("edit")'/> Edit
<input id='cancel' type='checkbox' onClick='showhide("cancel")'/> Cancel
关于javascript - 单击 anchor 标记时如何显示和隐藏输入?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59335237/