Question

这种做法可行吗？就像选中复选框时一样，将相关内容更改为输入形式，这样我就可以编辑信息。

Answer 1

您不能使用纯JavaScript更改元素的类型。但是您可以例如隐藏和显示一些输入。注册活动的方法如下：

var checkbox = document.getElementById('checkbox')

checkbox.addEventListener('change', (event) => {
  if (checkbox.checked) {
    //enable your input
  } else {
    //disable your input
  }
})

Answer 2

是的，当然可以。不确定您的用例，但是可以实现，这里是方法。

var input = document.createElement("input");
input.setAttribute('type', 'checkbox');
var parent = document.getElementById("parentDiv");
parent.appendChild(input);
input.addEventListener("change", function(){
  input.setAttribute('type', 'text');
  input.focus();
});

input.addEventListener("focusout", function(){
  if(input.getAttribute('type') == "text"){
    input.setAttribute('data-text', input.value)
   document.getElementById("parentDiv").innerHTML =      input.getAttribute('data-text');
   input.setAttribute('type', 'checkbox');
   parent.appendChild(input);
  }
})

#parentDiv{
height:150px;
width:300px;
border:1px solid green;
}

<div id="parentDiv">
 <span id="placeholder">Text will be here</span>
</div>

选中的make <div>上的复选框变为<input />形式

2 个答案: