Question

Html输入字段在锚标记内，如此...

<a id="brand" onclick="myFunction()" class="brand" ><input id="mytext" onclick="myFunction()" type="hidden" value="Anchor Title">Anchor Title</a>

Javascript使用设置属性

<script>
function myFunction() {
    document.getElementById("brand").innerHTML = "";

    document.getElementById("mytext").setAttribute("type", "text");

    var elem = document.getElementById("mytext");

    elem.value = "Edit Title";

    document.getElementById("brand").innerHTML = elem.value;
    }
</script>

实际结果

单击
但是，输入字段仍然隐藏

想要实现

单击
显示输入文本字段
用户输入文字
来自输入的文字成为主播标题
输入字段再次隐藏

Answer 1

我认为你应该删除这一行：

document.getElementById("brand").innerHTML = "";

（我不知道，但也许你删除输入元素。）

Answer 2

请注意，当您执行 document.getElementById（“brand”）。innerHTML =“”; 时，您将删除<a id="brand">和</a>之间的所有内容，这种情况是<input>行。

我的解决方案：

<html>

    <script>
    function myFunction1() {
        var elem1 = document.getElementById("mytext1")
        elem1.setAttribute("type", "text");
        elem1.value="Edit Title";
        document.getElementById("mytext2").innerHTML = "";
    }

    function myFunction2() {
        var elem1 = document.getElementById("mytext1")
        elem1.setAttribute("type", "hidden");
        document.getElementById("mytext2").innerHTML = elem1.value;
    }
    </script>


    <a id="brand" onclick="myFunction1()" class="brand" >
        <input id="mytext1" onchange="myFunction2()" type="hidden" value="Anchor Title">
        <span id="mytext2">Anchor Title</span>
    </a>

</html>

使隐藏的输入字段可见HTML Javascript

2 个答案: