javascript - Chrome 上使用 ClojureScript 的 AJAX 请求有时会有 nil 作为参数

Question

编辑

这是一个JSFiddle用一个最小的例子。问题是，在 Firefox 中，我点击按钮的位置并不重要。事件的目标始终是按钮。

另一方面，在 Chrome 中，如果我单击跨度，则事件的目标是跨度而不是按钮。

这是预期的行为吗？

原版

我在客户端使用 clojurescript 在 clojure 中编写了一个小型 web 应用程序，其中包含 以下路线:

(POST "/admin/delete-user" {p :params}
        (println (str "Deleted User: "(pr-str (:username p))))
        (db/delete-user (:username p))
        "Expected return value")

一个页面包含以下按钮:

<button class="delete btn" data-delete="USERNAME">...</button>

此按钮与以下 ClojureScript 结合使用:

(listen!
   (by-class "delete")
   :click (fn [evt]
            (let [target (evt/target evt)
                  username (:data-delete (attrs target))]
              (POST "/admin/delete-user"
                    {:format :edn
                     :params {:username username}
                     :handler (fn [resp]
                                (log "User deleted")
                                (load-user-table))
                     :error-handler (fn [resp] (log "Error during user deletion"))})
              (log "User " username))))

我使用 domina 进行 dom 操作和事件处理，使用 cljs-ajax 进行 ajax 请求。这 代码是在我的 lein cljsbuild 设置中使用高级优化进行编译的。

在 Firefox 上，这段代码工作正常，但是当我在 Chrome 中使用我的代码时，我 “有时”得到的行为而不是用户名 按钮的 data-delete 属性 nil 用作参数。

当发生这种行为时，我可以重复单击该按钮，但什么也没有 发生。然后多次点击后就可以了。

我还检查了控制台输出，没有发生错误，只是 t 显示 记录“User”后没有任何内容，因此用户名必须为null。

Chrome 中用户名怎么可能为空？

Answer 1

我发现了问题:

我必须使用current-target，而不是(target evt)。在 Firefox 中，点击事件是在 Chrome 中 span 上的 button 上触发的。