时间戳

首页 > 解决方案 > 获取在另一个函数中设置为变量的函数中的当前输入值。(I AM STUMPED) 内的代码示例

javascript - 获取在另一个函数中设置为变量的函数中的当前输入值。(I AM STUMPED) 内的代码示例

问题描述

我有一个难题，我正在尝试获取输入字段的输入值，但是，我需要在另一个函数中发生这种情况。

我已经有可以在这个其他函数之外工作的代码，但是我需要重构它以在我正在调用的另一个函数中工作。

工作代码和非工作代码的示例如下。

这是我获取输入的 HTML：

<!DOCTYPE HTML>
<HTML>
<head>
<title></title>
<meta charset="utf-8" />
<meta http-equiv="x-ua-compatible" content="ie=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" href="css/styles.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script type="text/javascript" src="js/require.js"></script>
<script type="text/javascript">
  (function () {
    var config = {
      baseUrl: "js",
    };

    var dependencies = ["otherFile"];

    require(config, dependencies);
  })();
</script>
</head>

<body>
<div>
  <label>Input URL</label>
  <input type="url" />
  <p id="targetInput"></p>
</div>
</body>
</html>

这是我试图在另一个函数中调用的非工作 JS：

function someOtherFunction() {
  var getCurrentInput = function() { };
  var input = document.querySelector("input");
  var log = document.getElementById("targetInput");

  input.addEventListener("input", getCurrentInput);

  var getCurrentInput = function (e) {
  log.currentInput = e.target.value;
  };
  }
  });

最后，这里是在 someOtherFunction 范围之外工作的工作代码

  var getCurrentInput = "";
  var input = document.querySelector("input");
  var log = document.getElementById("targetInput");

  input.addEventListener("input", getCurrentInput);

  function getCurrentInput(e) {
  log.currentInput = e.target.value;
  }

现在您可能会注意到这里没有提交表单，原因是此代码运行在一个 iframe 上，该 iframe 正在被另一个应用程序调用。提交在那里发生，但需要我调用一个函数来实现它，技术上不是提交，这意味着我无法像常规提交那样控制它。这就是为什么我需要在 someOtherFunction 中调用当前输入值。

任何帮助将不胜感激！本质上，我想获取输入中的值并使用 JSON 字符串的值更新我的 API。肯定有更好的办法！

标签： javascriptfunctionevents

解决方案

考虑到嵌套，起初有点难以理解，但是像这样？

const doThing = (e) => {
  let input = document.getElementById("input");
  let log = document.getElementById("targetInput");
  log.textContent = input.value; 
}
<div>
  <label>Input URL</label>
  <input type="url" id="input"/>
  <p id="targetInput"> </p>
</div>

<button onclick="doThing()">Click</button>

本质上是一个外部提交，它接受一个内部输入值，并将其注入另一个内部元素？

推荐阅读