Question

我正在读klaviyo＆＃39; integration guide。用于提交表单数据的javascript是：

<script type="text/javascript">
    $("input[name='contact[email]']").on('blur', function(e) {
        e.preventDefault();
        var email = $(this).val();
        var settings = {
            "async": true,
            "crossDomain": true,
            "url": "https://manage.kmail-lists.com/subscriptions/external/subscribe",
            "method": "POST",
            "headers": {
                "content-type": "application/x-www-form-urlencoded",
                "cache-control": "no-cache"
            },
            "data": {
                "g": "LIST_ID",
                "$fields": "$source",
                "email": email,
                "$source": "Shopify form"
            }
        };
        $.ajax(settings).done(function (response) {
            console.log(response);
        });
    });
</script>

我想知道它为什么使用＆＃34;模糊＆＃34;事件而不是用户点击＆＃34;提交＆＃34;按钮触发ajax功能。我认为使用此代码，如果用户过早地选择退出表单的文本框而不点击＆＃34;注册＆＃34;或者＆＃34;提交＆＃34;，数据将被提交。

Answer 1

当元素失去焦点时可能会触发模糊事件，并且可能会在＆＃39;之后触发。输入的电子邮件将被发送。这对于一般来说的下降转换很有帮助。

Answer 2

“我想知道为什么它使用”模糊“事件而不是用户点击”提交“按钮来触发ajax功能。”

因为这两种方式会给你两种不同的行为。很简单：

当您使用click事件时，将在按钮
当您使用blur事件时，该功能将在输入失去焦点后执行

为什么使用模糊事件代替提交表单数据提交？

2 个答案: