javascript - 未捕获的 TypeError : $(. ..)[0].reset 不是函数

Question

目标

表单成功提交后，我想将表单重置为空。

问题

提交表单后，我在控制台中收到以下错误消息:Uncaught TypeError: $(...)[0].reset is not a function

当我在重置之前console.log我的内容时，我得到的形式是:<div id=new-store-form>..</div>

到目前为止我检查过的内容

• 在我的应用程序中，没有 id、类或任何其他称为“重置”的内容
• 纯 JavaScript document.getElementById('new-store-form').reset();给我同样的错误消息。

代码 View /stores/index.html.erb

<div class="show-panel-form"></div>
  <%= render "partials/show_panel_stores_overview"%>
</div>

views/partials/show_panel_stores_overview.html.erb

<%= link_to 'New store', new_store_path, remote: true %>

View /stores/new.js.erb

var form = $("<%= j(render 'form') %>");
var wrapper = $('<div>').attr('id', 'new-store-form').append(form);
$('.show-panel-form').html(wrapper);

浏览/商店/_form

<%= simple_form_for (Store.new) do |f|%>
<%= f.input :name %>
<%= f.button :submit%>

views/stores.create.js.erb

var form = $("<%= j(render 'form') %>");
var wrapper = $('<div>').attr('id', 'new-store-form').append(form);
$('.show-panel-form').html(wrapper);
console.log($("#new-store-form")[0])
$("#new-store-form")[0].reset(); // doesn't work

商店 Controller

def new
    @store = current_user.store.build
    @store.age_tables.build
    respond_to do |format|
      format.html { redirect_to root_url, alert: 'Page not accessible' }
      format.js
    end
    authorize @store

  end

  def create
    @store = current_user.stores.create(store_params)
    authorize @store
    if @store.save
      respond_to do |format|
        format.js
      end
    else
      format.js
    end
  end

Answer 1

使用与表单匹配的选择器，而不是包装器$('#new-store-form form').reset()(注意额外的“form”来选择实际的表单标签在 div 内)