Javascript 表单输入文本显示为“或”；“未定义”；或；[对象HTMLInputElement]”的；

我有一个表格，上面有id的名称、标题和相应输入框的描述。 但是，当我尝试在HTML中显示这些值时，我会收到“[object HTMLInputElement]”或“undefined”

对于下面的代码块，我得到了“未定义”，我在函数外部全局声明了变量名称、标题和描述，以检索输入值

var name;
var title;
var description;      
document.getElementById("name").onchange = function(){
      name = document.getElementById("name").value;
      };
document.getElementById("title").onchange = function(){
          title = document.getElementById("title").value;
      };
document.getElementById("description").onchange = functio){
          description = document.getElementById("description").value;
      };

var myhtml = '<p>' + name + '</p><p>' + title + '</p><p>' + description + '</p><p>';

myHTML是在DOM中打印的变量

这是怎么回事？如果全局声明了函数，我尝试将名称、标题和描述传递到函数中。但这并没有解决问题（我仍然得到“[object HTMLInputElement]”）。

这些“未定义”值是由于在输入发生更改之前没有触发“onchange”事件造成的。这个jsfiddle说明了我的观点：。请注意，键入输入元素的值后，将显示全局变量的新值。我添加了以下函数来输出值：

function showInputs() {
    var myhtml = '<p>' + name + '</p><p>' + title + '</p><p>' + description + '</p>';
    var elem=document.getElementById('output');
    elem.innerHTML = myhtml;
}

函数showInputs（）{
var myhtml=''+name+'
'+title+'
'+description+'
'；
var elem=document.getElementById（'output'）；
elem.innerHTML=myhtml；
}

未定义

，因为变量在运行时未定义（您正在设置事件侦听器中的值，在声明

myhtml

时显然未触发这些值）

[object HTMLInputElement]

，因为如果没有名为

ID\u of_element

的全局变量，可以通过

窗口[“ID\u of_element”]

访问具有ID属性的元素。在DOM中如何“打印”myhtml？您已经定义了onchange事件，因此除了处理程序外，不会显示值。谢谢大家的评论。现在，正如@RobW的评论所暗示的那样，我正在修补函数分解、作用域和运行时。上面的代码块是双重嵌套的“click”函数的一部分，该函数位于两个dom/window init函数中。所以事情可能变得一团糟。而且，我现在在移动街区后得到[Object Object]的一个值。Downvoter应该解释downvote…是的，正如你暗示的，这是由于“onchange”事件触发得太早；在我的例子中，这是因为它们的函数为name、title和description变量赋值，这些变量位于一个函数中，这个函数可能在DOM和表单加载之前就已经启动了。我将代码块移动到一个传统的$（document）.ready（）函数，以确保首先加载表单。谢谢你的盛情款待。

function showInputs() {
    var myhtml = '<p>' + name + '</p><p>' + title + '</p><p>' + description + '</p>';
    var elem=document.getElementById('output');
    elem.innerHTML = myhtml;
}