Question

我想在输入字段中获取用户输入，然后在单击时显示返回消息。代码是这样的：

var link = document.getElementById("link");
var getNames = document.getElementById("getName");
var lastName = getNames.value;

function showName (lastName) {
var nameIntro = "Your name is ";

function makeFullName () {       
return nameIntro  + " " + lastName;   
}

return makeFullName ();
}
link.addEventListener('click',function(){link.innerHTML+=showName     (lastName);
});

我可以在没有这个闭包的情况下使用它，但仅限于给定的名称。我想将用户输入作为参数传递，但这不起作用。

我已经检查了答案，但我找不到本机JS示例，其中手头的问题是相同的。

链接到笔：

http://codepen.io/damianocel/pen/RRWzdr

Answer 1

您需要将getNames.value传递给您的函数：

link.addEventListener('click', function(){
    link.innerHTML += showName(getNames.value);
});

这是因为您在用户尚未输入任何内容时设置lastName。

备注

不建议使用innerHTML，因为输入名称有<或&时可能会出错，但不太可能。另外，建议不要在+=添加HTML。

而是保留span仅包含名称：

<a id="link" href="http://www.facebook.com">
  <img src="http://www.bzeaz.org/wp-content/uploads/2015/10/img-thing.jpg" width=100 height=100>
  <span id="name"></span>
</a>

在JavaScript中使用textContent：

var setName = document.getElementById("name");
// ...
link.addEventListener('click',function(){
    setName.textContent = showName(getNames.value);
});

根据用户输入更新输入文本值并显示值

1 个答案:

备注