时间戳

首页 > 解决方案 > 将输入从 HTML 保存到函数 Javascript 之外的变量

javascript - 将输入从 HTML 保存到函数 Javascript 之外的变量

问题描述

我对 Javascript 很陌生，我有一个非常简单的程序，它从 HTML 输入中获取值，然后它应该重新分配变量 car。但是，第二个 x2 似乎无法识别该值，只有 x1。我已经阅读了一些文章，一些程序员不建议使用全局变量，如果不需要的话。我也想在函数外访问我的变量提前谢谢你回答这个愚蠢的简单代码。

var car;

function save_car() {
    car = document.getElementById("car-text").value;
    document.getElementById("x1").innerHTML = "Your car is" + car;
}
save_car();
document.getElementById("x2").innerHTML = "Your car is " + car;
  <input id="car-text" type="text">
        <button onclick="save_car()">Save</button>
   
        <p id="x1"></p>

        <p id="x2"></p>

标签： javascripthtmlvariablesinputglobal-variables

解决方案

主要问题是您在保存功能之外设置了“x2”。

我在下面的代码中做了一些其他的注释/评论。

// var car;  <-- you didn't need this global variable

function save_car() {
    let car = document.getElementById("car-text").value;
    let innerString = "Your car is " + car; // <-- we're going to reuse this, so store in variable
    document.getElementById("x1").innerHTML = innerString;
    document.getElementById("x2").innerHTML = innerString; //moved inside save_car() function
}

// save_car(); <-- you don't need this either
  <input id="car-text" type="text">
  <button onclick="save_car()">Save</button>
   
  <p id="x1"></p>
  <p id="x2"></p>

推荐阅读