时间戳

首页 > 解决方案 > 当用户单击按钮时，如何使 html 运行 javascript 函数？

javascript - 当用户单击按钮时，如何使 html 运行 javascript 函数？

问题描述

我有一个网络表单，用户将在其中输入一个人的姓名，然后单击一个按钮以打开有关该人的页面。例如，他们键入 Player One 并运行一个打开文件 C:\PlayerOne 的函数。

我已经尝试使用<button>标签并添加onclick元素来运行该功能，但我也无法诊断那里的问题。我不太熟悉的事件监听器的东西，但我看到它 [here] ( https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/button ) 所以我想我d 尝试那样做。

<form>
  <fieldset>
    <legend>Enter player name: </legend>
    First name:<br>
    <input type="text" name="firstname"><br>
    Last name:<br>
    <input type="text" name="lastname"><br><br>
    <input type="button" value="Submit">
  </fieldset>

  <script>
    const input = document.querySelector('button');
    input.addEventListener('click', UseData);
    function UseData()
        {
        var Fname=document.GetElementById('firstname');
        var Lname=document.GetElementById('lastname');
        window.location = "C:\" + Fname + Lname;
        }
  </script>
</form>

我希望用户能够键入名称并打开相应的文件，如上所述。然而，此时的按钮根本不做任何事情。我确实有一个测试文件供它参考，我一直在表单的字段中输入它的名称。

标签： javascripthtmlwebpage

解决方案

这是因为您的表单中没有button标签。像这样使用属性选择器：

const input = document.querySelector('input[type="button"]');

推荐阅读