Question

<div id="input">
<input type="text" id="name")"></input>
</div>

<button type="button" id="b1" onclick="changed('click',getElementById('name').value)" value="Log In">Log In</button>

<script>

function changed(action,val)
{
    var op
    var element = document.getElementById("input")
    var child = document.getElementById("name")
    if(action == "click")
    {
        e = document.getElementById("b1")
        if(e.value == "Log In")
        {
            //element.removeChild(child)
            op = "Log Out"
        }
        else if(e.value == "Log Out")
        {
            element.appendChild(child)
            op = "Log In"
        }
        e.value = op
        e.innerHTML = op
    }
}
</script>

这是我的代码并且使用“element.removeChild（child）”行注释掉按钮可以多次单击，按钮上的值和文本会按预期更改。删除注释后，按钮只能单击一次，一旦删除输入行，就不再有任何功能。我之前从未使用过这个代码元素，我不清楚为什么它不起作用。任何帮助表示赞赏。

Answer 1

正如我在评论中提到的，你的脚本的目标或最终结果对我来说并不清楚。我的理解是你有一个带文字的按钮＆＃34;退出＆＃34;。点击此按钮后，您将显示一个输入框和按钮＆＃34;登录＆＃34; ，再次点击它将再次返回＆＃34;退出＆＃34;。如果这是您的标准，那么下面的代码段可能很有用

JS

function changed(elem,btn)
{
   var element = document.getElementById(elem);
    if(btn.value == 1){
     element.classList.remove('hide');
      element.classList.add('show');
       btn.value=2;  // Setting button value to 2 
      btn.textContent="Log In";
    }
    else if(btn.value ==2){
      element.classList.remove('show');
      element.classList.add('hide');
       btn.value=1;  // Setting button value to  
      btn.textContent="Log Out";

    }
}

HTML

<div id="input" class="hide">
<input type="text" id="name">
</div>

<button type="button" id="b1" onclick="changed('input',this)" value="1">Log Out</button>

这是一个DEMO。让我知道它是否对您有帮助＆amp;如果有任何改变，也是如此。

.removeChild（child）似乎阻止我的脚本运行

1 个答案: