jQuery .append() 表单提交上的像素

Question

我有一个form，它有一个onsubmit函数调用，尝试使用.append()向页面添加一些转换像素.

表单submit正在触发，并在像素有机会触发之前将用户重定向到页面(在chrome网络调试器中显示为取消的请求)。

我已经尝试使用 setTimeout() 等进行一些操作，但似乎无法正常工作。

我知道我可以使用 onclick 事件与输入键检查相结合，然后在 setTimeout 调用上提交表单。然而，这似乎有点老套。

此外，我无权访问表单提交到的页面。无法将像素添加到此页面。

还有什么更好的方法吗？

Answer 1

我认为跟踪转化的最佳选择是在提交表单后从显示的页面请求这些像素。但如果您无法控制该页面，则如下:

$('form').submit( function(e){
    e.preventDefault(); // do not submit the form just yet
    var $t = $(this), 
        trackingUrl = 'http://placekitten.com/20/10'; 
        $('<img />')
            .on('load', function(){ // when the image loads...
                $t.unbind('submit')  // ...unbind the event listener preventing an endless loop
               .submit() // and submit the form
        }).attr('src', trackingUrl );
});

编辑:您还应该添加一些预防措施(例如 onerror 事件)，以防跟踪图像加载失败，否则表单根本不会提交。