使隱藏的輸入字段可見的HTML Javascript

Question

HTML輸入字段是在錨標簽內，例如..

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

Javascript使用set屬性

<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 個解決方案

解決方案1
0 2014-10-14 16:57:00

解決方案2
0 2014-10-14 17:21:17

使隱藏的輸入字段可見的HTML Javascript

問題描述

2 個解決方案

解決方案1 0 2014-10-14 16:57:00

解決方案2 0 2014-10-14 17:21:17

解決方案1
0 2014-10-14 16:57:00

解決方案2
0 2014-10-14 17:21:17