Javascript 输入用户名后编辑占位符html

为了节省空间（并使事情更加紧凑），我添加了一个带有占位符的输入框

<input id="username-search" placeholder="view another users work">

添加用户名后，我想将占位符的文本更改为

<input id="username-search" placeholder="viewing -theuser-'s work">

以及删除用户添加到输入框中的文本，就像输入文本时，占位符消失一样

---

有什么想法吗？

真的很简单。试试这个：

var input = document.getElementById('username-search');
input.onclick = function() {
    input.setAttribute('placeholder', "viewing " + input.value + "'s work");
    input.value = '';
}

---

在框中键入内容，然后单击框。该值将被删除，但占位符将更新为“查看Adam的工作”。

您可以根据需要在

onchange

事件处理程序中为

手动更改

占位符属性：

<input id="username-search" placeholder="view another users work"
               onchange="changePlaceholder(this)">
<script>
function changePlaceholder(input){
    if (input.value == '') { 
        input.placeholder = "view another users work";
    }
    else {
        input.placeholder="viewing " + input.value + "'s work";
        input.value="";
    }
}
</script>


函数更改占位符（输入）{
如果（input.value=''）{
input.placeholder=“查看其他用户的工作”；
}
否则{
input.placeholder=“查看”+input.value+“”的工作”；
输入值=”；
}
}


考虑到
的值将在
onchange（）之后被清除，因此如果您希望在
onchange
之外对其进行处理，您可能希望保留一个带有最后输入值的
，这两个答案都很好，但我使用了此代码，因此正确答案是勾选的，谢谢。