Question

我有一个名为Susan的对象，如下所示：

var Susan = {
age: 30,
lastName: "Dumb"
};

在我的html文件中，我有一个文本输入和一个提交按钮。每次按下按钮，它都会调用一个函数，该函数应该将Susan.age更改为用户编写的任何内容。

<input type = "text" id = "Up">
<button id = "btn1" onclick="SubmitFunc()">Submit</button>

该功能本身如下：

function SubmitFunc()
{
Susan.age = document.getElementById("Up").value;
}

该部分工作正常但我想要做的是将新值打印到Console但它不能像我想要的那样工作。当我添加：

Console.log(Susan.age);

到SubmitFunc函数它只打印出我点击按钮时的值，然后它就消失了。当我只是在函数之后添加它时它总是输出默认值30.我也尝试将onload函数添加到body元素但它也没有用。有没有人有任何想法？

Answer 1

Oki几个更新：

将this（当前对象引用）添加到onclick函数调用中。
您需要从文本框中获取值，当前从btn
在console.log中，c很小;）

＆＃13;

var Susan = {
age: 30,
lastName: "Dumb"
};

function SubmitFunc()
{
Susan.age = document.getElementById("Up").value;
console.log(Susan.age);
}

＆＃13;

<input type = "text" id = "Up">
<button id = "btn1" onclick="SubmitFunc(this)">Submit</button>

＆＃13;

Answer 2

将函数中的元素id从“btn1”更改为“Up”：

<!DOCTYPE html>
<html>
  <head>
    <meta charset='utf-8' />
    <script>
      var Susan = {
        age: 30,
        lastName: 'dumb'
      };

      function SubmitFunc(){
        Susan.age = document.getElementById('Up').value;
        console.log(Susan.age);
      }
    </script>
  </head>
  <body>
    <input type='text' id='Up'/>
    <button id= 'btn1' onclick='SubmitFunc()'>Submit</button>
  </body>
</html>

还要考虑使用

<input type='button' value='Submit'/>

而不是按钮标记（不一定只是样式推荐）。

Answer 3

像这样修改：原因是你的第一个console.log是由于按钮点击而不是reset的老年您还需要从输入字段中读取值。

最后，在您的代码console.log中有大写C。

var Susan = {
        age: 30,
        lastName: "Dumb"
    };
    function SubmitFunc() {
        Susan.age = document.getElementById("Up").value;
        console.log(Susan.age);
    }

将更改的值打印到控制台日志中

3 个答案: