将文本框转换为任何其他html元素

Converting a textbox into any other html element

本文关键字：其他 html 元素 任何 文本 转换      更新时间：2023-09-26
<form name="txt" method="post">
<input type="text" name="select" id="select" onclick="return selectbox();">
</form>

现在通过js或html我可以改变我的文本框为一个选择或列表框。有可能吗?

//js代码
function selectbox()
{
var select=document.getElementById('select');
select.innerHTML="<select><option>1</option><option>2</option></select>";
}

这样的事情应该发生。在文本框的位置应该出现下面的代码//新文本框

<select><option>1</option><option>2</option></select>

是，例如:

var select = document.createElement("select");
select.innerHTML = "<option value='1'>One</option>" +
                   "<option value='2'>Two</option>" +
                   "<option value='3'>Three</option>";
select.id = "select";
select.name = "select";
select.onclick = function(){return selectbox()};
var currentSelect = document.getElementById("select");
currentSelect.parentNode.replaceChild(select, currentSelect);
select.focus(); //Focus on the element

这个代码片段创建了一个<select>元素，并通过.innerHTML向它添加了新的选项。然后，设置属性。最后。脚本从HTML文档中选择当前具有id="select"的元素，并用新创建的元素替换该元素。

更具体地说明是什么以及如何。您可以尝试以下操作

function selectbox(Sender){         
    var select = document.createElement('select');
    //UPDATE
    for(var i=1; i<=2; i++)
       select.options[select.options.length] = new Option(i, i);
    Sender.parentNode.appendChild(select);
    Sender.parentNode.removeChild(Sender);
}
相关文章：