单击提交按钮时加载像素

Question

每当访问者点击表单上的提交按钮时，我都想在我的服务器日志中显示。

因此我创建了课程sub并将其放在提交按钮的DIV中：

<div id="submit-element" class="form-element sub"><input name="submit" id="submit_form" type="submit" tabindex="8" value="Click Here" /></div>

这是JS：

var loaded=!1;$(".sub").click(function(){loaded||(loaded=!0,$('<img src="/pixel.gif?sub='+loaded+'" width="1" height="1" style="display:none" />').appendTo("body"))})

测试时，它似乎仅适用于我的iPhone Safari，而不是我的桌面电脑 - 像素不会显示在日志中，也不会显示在Chrome或IE中。

我不知道这是否与我使用某些JS验证程序脚本以确保用户在提交之前输入表单中的所有必填字段有关。但无论如何，我想要加载这个像素，即使他没有输入必要的字段。

编辑 - 验证码：

jQuery(document).ready(function ($) {


    $('input,select').bind('focusin focus', function(e){
    e.preventDefault();
    })

    //Keypress from zipcode and number
    $('[name^=zipcode],[name^=phone]').attr('inputmode','numeric');

    $('[name^=zipcode],[name^=phone]').keypress(validateNumber);
    //alert($(".wc_global_form").innerHeight())
    $("#ouibounce-modal .modal").height($("form.global_form").innerHeight()+38);

    //$("#colorbox").height($("#cboxLoadedContent").height());
var deviceAgent = navigator.userAgent.toLowerCase();

var isTouchDevice = Modernizr.touch || 
(deviceAgent.match(/(iphone|ipod|ipad)/) ||
deviceAgent.match(/(android)/)  || 
deviceAgent.match(/(iemobile)/) || 
deviceAgent.match(/iphone/i) || 
deviceAgent.match(/ipad/i) || 
deviceAgent.match(/ipod/i) || 
deviceAgent.match(/blackberry/i) || 
deviceAgent.match(/bada/i));
if(isTouchDevice) {
    //$('form[target="_blank"]').removeAttr('target');
}

function checklabel(){
    var windowsize = $(window).width();


if (windowsize < 480) {
    $(".phasepopup .form-wrapper label").each(function() {
    var label = $(this);
    var placeholder = label.text();
    var eId=label.attr('for');
    label.parent().closest('div').next('div').find('input').attr("placeholder", placeholder );
    label.hide();
    });

    $(".popupform .form-wrapper label").each(function() {
    var label = $(this);
    var placeholder = label.text();
    var eId=label.attr('for');
    label.parent().closest('div').next('div').find('input').attr("placeholder", placeholder );
    label.hide();
    });

    $("form.innerform .form-wrapper label").each(function() {
    var label = $(this);
    var placeholder = label.text();
    var eId=label.attr('for');
    label.parent().closest('div').next('div').find('input').attr("placeholder", placeholder );
    label.hide();
    });

}
else{

    $(".phasepopup .form-wrapper label").each(function() {
    var label = $(this);
    var placeholder = label.text();
    var eId=label.attr('for');
    label.parent().closest('div').next('div').find('input').attr("placeholder", '' );
    label.show();
    });

    $(".popupform .form-wrapper label").each(function() {
    var label = $(this);
    var placeholder = label.text();
    var eId=label.attr('for');
    label.parent().closest('div').next('div').find('input').attr("placeholder", '' );
    label.show();
    });

    $("form.innerform .form-wrapper label").each(function() {
    var label = $(this);
    var placeholder = label.text();
    var eId=label.attr('for');
    label.parent().closest('div').next('div').find('input').attr("placeholder", '' );
    label.show();
    });
}

}
    checklabel();
    // Bind event listener
    $(window).resize(checklabel);

    $.validator.setDefaults({
        submitHandler: function(form) {
            form.submit();
        }
    });

            // validate innerform form on keyup and submit
        $(".innerform").validate({
            rules: {
                firstname: "required",
                lastname: "required",
                zipcode: {
                    required: true,
                    minlength: 5,
                    maxlength: 5,
                    number: true
                },
                phone: {
                    required: true,
                    minlength: 10,
                    maxlength: 10,
                    number: true
                },
                email: {
                    required: true,
                    email: true
                },
                service:"required"

            },
            messages: {
                firstname: "firstname required",
                lastname: "lastname required",
                zipcode: {
                    required: "Zipcode required",
                    maxlength: "Zipcode must be 5 digit"
                },
                phone: {
                    required: "Phone required",
                    maxlength: "phone must be 10 digits"
                },
                email: "Please enter a valid email",
                service: "Please select service"
            }
        });

            // validate popupform form on keyup and submit
        $(".popupform").validate({
            rules: {
                firstname: "required",
                lastname: "required",
                zipcode: {
                    required: true,
                    minlength: 5,
                    maxlength: 5,
                    number: true
                },
                phone: {
                    required: true,
                    minlength: 10,
                    maxlength: 10,
                    number: true
                },
                email: {
                    required: true,
                    email: true
                },
                service:"required"

            },
            messages: {
                firstname: "firstname required",
                lastname: "lastname required",
                zipcode: {
                    required: "Zipcode required",
                    maxlength: "Zipcode must be 5 digit"
                },
                phone: {
                    required: "Phone required",
                    maxlength: "phone must be 10 digits"
                },
                email: "Please enter a valid email",
                service: "Please select service"
            }
        });
        //phasepopup


            // validate phasepopup form on keyup and submit
        $(".phasepopup").validate({
            rules: {
                firstname: "required",
                lastname: "required",
                zipcode: {
                    required: true,
                    minlength: 5,
                    maxlength: 5,
                    number: true
                },
                phone: {
                    required: true,
                    minlength: 10,
                    maxlength: 10,
                    number: true
                },
                email: {
                    required: true,
                    email: true
                },
                service:"required"

            },
            messages: {
                firstname: "firstname required",
                lastname: "lastname required",
                zipcode: {
                    required: "Zipcode required",
                    minlength: "Zipcode must be 5 digit"
                },
                phone: {
                    required: "Phone required",
                    minlength: "phone must be 10 digits"
                },
                email: "Please enter a valid email",
                service: "Please select service"
            }
        });


});

function validateNumber(event) {
    var key = window.event ? event.keyCode : event.which;

    if (event.keyCode === 8 || event.keyCode === 46
        || event.keyCode === 37 || event.keyCode === 39) {
        return true;
    }
    else if ( key < 48 || key > 57 ) {
        return false;
    }
    else return true;
};