Javascript 将selectbox更改为textfield，反之亦然_Javascript_Html_Html Table

Javascript 将selectbox更改为textfield，反之亦然

javascript html

Javascript 将selectbox更改为textfield，反之亦然,javascript,html,html-table,Javascript,Html,Html Table,我有一个表，其中有三列（a:datefield，B:selectbox，C:checkbox）现在，当有人选中复选框时，具有selectbox的列（B）应转换为列文本字段。这意味着我想在更改复选框事件时将selectbox转换为textfield，反之亦然。这可能吗？？如果是，怎么做？（使用js，请不要使用jquery）非常感谢您的回复。将两个div标签放在其中一个包含要更改的组件（对于此div，请给出类名“comp1 visible”，并且在CSS集中，样式具有display:block

我有一个表，其中有三列

（a:datefield，B:selectbox，C:checkbox）

现在，当有人选中复选框时，具有selectbox的

列（B）

应转换为列文本字段。这意味着我想在更改复选框事件时将selectbox转换为textfield，反之亦然。这可能吗？？如果是，怎么做？（使用js，请不要使用jquery）

非常感谢您的回复。

将两个div标签放在

其中一个包含要更改的组件（对于此div，请给出类名“comp1 visible”，并且在CSS集中，样式具有

display:block

）

还有一个div，其中包含您想要替换的组件（对于这个div，给出一个类名“comp2 hidden”，并且在CSS集合中样式有

display:none

）

使用onclick事件调用函数

function insertitem(rvalue){
            if(rvalue.value==1){
                var temp=document.getElementsByClassName("comp1");


            temp[0].classList.remove("hidden");
            temp[0].classList.add("visible");
            }
            else if(rvalue.value==2){
                var temp=document.getElementsByClassName("comp2");

            temp[0].classList.remove("hidden");
            temp[0].classList.add("visible");

            }
        }

这应该行得通。。附言：既然你不能发布你的任何代码。。我无法解释太多

请尝试以下方法

<html>
<body>
    <script type="text/javascript">
function toggleSelect() {
    var isChecked = document.getElementById("check").checked;
        if(isChecked) {
    document.getElementById("toggle").innerHTML = "<input type='text' id='txt'></input>";
    } else {
    document.getElementById("toggle").innerHTML = "<select> <option value='1'>1</option> </select> ";
    }
    //alert(isChecked);
}
</script>
    <table> 
        <tr> 
            <td> DateField </td>
            <td id="toggle"> 
                <select> <option value="1">1</option> </select> 
            </td>
            <td> <input type="checkbox" id="check" onchange="javascript:toggleSelect();">change</input></td>
        </tr>
    </table>
</body>
</html>


函数toggleSelect（）{
var isChecked=document.getElementById（“检查”）.checked；
如果（已检查）{
document.getElementById（“切换”）.innerHTML=“”；
}否则{
document.getElementById（“切换”）.innerHTML=“1”；
}
//警报（已检查）；
}
日期字段
1.
改变

u尝试过任何东西吗？？？你必须用JS手工做，使用

上的

更改侦听器。如果我理解正确，你是否尝试过使用数据列表
而不是选择，你可以尝试@CoolGurl，你能分享你的html和javascript吗，如果有的话？我知道了。。。“.checked”事件已工作