为输入字段(而不是表单的一部分）设置默认按钮(或在 javascript 中触发其事件）的最佳方法

Best way to set a default button (or trigger its event in javascript) for an input field, not part of a form

本文关键字：javascript 方法 最佳 事件 或在 默认按钮 表单 输入 设置 一部分 字段      更新时间：2023-09-26

我有一个独立的输入字段，不是任何形式的。

我还得到了一个按钮，它有一些点击事件。

当我在输入字段中键入内容并按 Enter 键时，我希望它有效地按下按钮，或触发其 onclick 事件。因此，可以说该按钮是"输入字段的默认按钮"。

<input id='myText' type='text' />
<button id='myButton' onclick='DoSomething()'>Do it!</button>

我想我可以弄乱输入字段的按键或键按下事件并检查 Enter 键等。

但是有没有一种更"干净"的方式，我的意思是将按钮与该输入字段相关联的东西，以便按钮是"默认操作"或该字段的内容？

请注意，我不在表单中，我没有发送、发布或提交某些内容。DoSomething（） 函数只是在本地更改一些 HTML 内容，具体取决于文本输入。

将 HTML 更改为：

<form onsubmit="DoSomething();">
  <input id='myText' type='text' />
  <input type="submit" value="Do it!" />
</form>

提交按钮（在表单中）会自动触发，您按回车键。

但是，请确保取消提交事件，您不希望浏览器重新定位。

使用以下命令取消默认值：event.preventDefault()或让您的函数返回 false 。

尝试将你的JavaScript与你的标记分开。

.HTML 

<form id="myform">
  <input id='myText' type='text' />
  <input type="submit" value="Do it!" />
</form>

.JS

$("#myform").submit(function(e) {
     // do something
     e.preventDefault();
});

编辑：

如果您不想使用表单，那么您只需执行以下操作：

$("#mybutton").on('click', function(){
     // Do something
});

更好的解决方案是不使用html javascript事件，而是较旧。最好在MVC等层中分离代码，html是视图，.js是控制器

我创建了一个文件函数.js

jQuery("#myButton").on("click", function() {DoSomething()});
相关文章：