获取输入的当前值 HTML JS

Question

我有一个 html 页面，它需要在按下按钮时获取输入值，以便它可以用作 link 中的变量。例如，我的网站会检测到输入中写入的“单词”，并会在单击按钮时重定向到 link“google.com/word”。提前感谢您的帮助！

HTML代码：

<td><input value="Input text Here..."></input></td>
<td><a href='https://example.com/test/VALUEFROMINPUTHERE'><button id="click">Click this Button</button></a></td>

Answer 1

在这段代码中，当 a 标签被点击时，它会触发一个 JS 函数，该函数获取 ID 为“value”的输入的值，并通过将它的值连接到末尾来打开 link URL 与 window.open() 函数。

<input type="text" placeholder="Enter Text" id="value" />
<a href="#" onClick="openLink()">Click Me</a>
<script>
function openLink() {
  let value = document.getElementById("value").value
  window.open(`https://www.example.com/${value}`)
}
</script>

Answer 2

无法仅使用 HTML 获取输入值...给您的按钮一个 onclick 属性：

<td>
  <a href='https://example.com/test/VALUEFROMINPUTHERE'>
    <button id="click" onclick="click()">Click this Button</button>
  </a>
</td>

并且您输入了一个 ID：

<td>
  <input value="Input text Here..." id="input">
</td>

并添加 JS:

function click() {
  let val = document.getElementById("input").value
  window.location.href = "https://www.google.com/search?q=" + val
}

我在这里所做的就是获取输入的值，并将 window 的 href 更改为所需的词，同时通过添加"https://www.google.com/search?q=" 在添加输入值之前。