如何使用Hyperscript实现表单提交时清空所有输入字段？

你可以直接修改form标签的_属性为以下内容：

<form hx-post="/example" hx-target="#table tbody" hx-swap="beforeend"
      _="on htmx:success reset me">
  <!-- 原有表单内部内容保持不变 -->
</form>

原写法失效的原因 #

• 时机错误：直接绑定submit事件时，清空操作会在htmx收集表单提交参数之前执行，最终会导致提交到后端的都是空值
• 选择器范围问题：你写的<input/>选择器默认匹配全局所有input元素，而非当前表单内的输入框，同时手动修改input value的方式兼容性差，无法覆盖下拉框、单选框、复选框等其他表单控件的重置需求

可选的其他写法 #

如果你需要无论请求成功失败都清空表单，可以将事件改为htmx:afterRequest：

_="on htmx:afterRequest reset me"

如果你确实需要手动指定清空当前表单内所有文本输入框，写法如下：

_="on htmx:success put '' into <input[type='text']/> in me"

内容的提问来源于stack exchange，提问作者Johan