Question

选中无限制时，请删除输入框。这样可行。但是，如果取消选中该复选框，则输入框将不会显示为备份。

<script type="text/javascript">
    function getQuantity() {
        var checkbox = document.getElementById("unlimited");
        var qty = document.getElementById("quantityspace");
        if(checkbox.checked == true){
             qty.style.display = 'none';
        }else if(checkbox.checked == false) {
             qty.stlye.display = '<input type="text" id="quantity" size="4" value="1" name="quantity" />';
        }
    }
</script>

<input type="checkbox" id="unlimited" name="unlimited" value="x" onClick="getQuantity(); " /> Unlimited? <span id="quantityspace">or specify:
<input type="text" id="quantity" size="4" value="1" name="quantity" /></span>

Answer 1

qty.stlye.display = '<input type="text" id="quantity" 
size="4" value="1" name="quantity" />';

应该是：

qty.style.display = 'inline'; // or block

display是已存在的输入标记的属性。您不需要将整个标记分配给属性以使其再次显示 - 实际上这是完全错误的。只需为该属性分配一个新的有效值即可显示，例如inline，inline-block或block，它会再次显示。

Answer 2

在你的else if(...)中：

qty.stlye.display

您的意思是style吗？

此外，您错误地定义了display属性。它应该是valid value。你可能希望它是：

else if(!checkbox.checked) {
    qty.style.display = 'inline'; // or something from the W3C link above
}

Answer 3

只是你拼错了'qty.stlye.display'吗？

Answer 4

将qty.stlye.display行更改为：

qty.style.display = "";

请注意，那里你拼错了“风格”。

Answer 5

您将“样式”拼错为“样式”，并且由于某种原因您将显示样式设置为HTML。在将其设置为“无”之前，它应该是“内联”或“阻止”或其他任何内容。

Answer 6

我认为你想要的是：

function getQuantity() {
    var checkbox = document.getElementById("unlimited");
    var qty = document.getElementById("quantityspace");
    if(checkbox.checked == true){
        qty.innerHTML = '';
    }else if(checkbox.checked == false) {
        qty.innerHTML = '<input type="text" id="quantity" size="4" value="1" name="quantity" />';
     }
}

如果我没错，你想在未选中复选框时在quantityspace元素中输入一个输入。

qty.style.display更改了范围的CSS display属性。 qty.innerHTML更改了范围内的HTML。

您可以使用以下代码.style.display执行此操作：

function getQuantity() {
    var checkbox = document.getElementById("unlimited");
    var qty = document.getElementById("quantityspace");
    if(checkbox.checked == true){
        qty.style.display= 'none';
    }else if(checkbox.checked == false) {
        qty.style.display= 'inline';
     }
}

使用复选框切换文本字段的显示

6 个答案: