传递给jquery.on（handler）的数据显示为未定义

我有三个锚定标记，它们是从ajax$.get（）响应中添加的
单击其中一个请求时，我需要触发第二个请求。
第二个请求的参数由这些锚中html全局数据属性的值设置

<div id="qbostatus">
    <a class='button radius small updateqbo' data-customer_id='1032' data-push='yes' data-create='no' style='margin-top:2em; margin-bottom:.4em;'>Accept and Push Changes</a>
    <a class='button radius small updateqbo' data-customer_id='1032' data-push='no' data-create='no' style='margin-bottom:.4em;'>Accept and Leave Alone</a>
    <a class='button radius small updateqbo' data-customer_id='' data-push='no' data-create='yes'>Reject and Create New</a>
</div>
<script>
    function updateQBO(event){
        console.log(event.data);
        $.ajax({
            type: "get",
            async: true,                
            url: "update_contact_updateQBO.php",
            success: function(result){
                $("#qbostatus").html(result);
            },
            data: {
                create: event.data.create,
                push: event.data.push,
                id: event.data.customer_id,
                fname: $("input[name='fname']").val(),
                lname: $("input[name='lname']").val(),
                email: $("input[name='email']").val(),
                street_address: $("input[name='street_address']").val(),
                city: $("input[name='city']").val(),
                state: $("input[name='state']").val(),
                zip: $("input[name='zip']").val(),
                phoneam: $("input[name='phoneam']").val(),
                phonepm: $("input[name='phonepm']").val()
            },
            beforeSend: function(jqXHR, settings) {
            console.log(jqXHR, settings);
            console.log(create);
            console.log(push);
            console.log(id);

            }       
        });         
    }


    $("#qbostatus").on("click", ".updateqbo", {
        customer_id: $(this).attr('data-customer_id'),
        push: $(this).attr('data-push'),
        create: $(this).attr('data-create')},
        updateQBO);

最初，我认为包含传递给事件处理程序的数据的普通对象有问题。因此，我独立地测试了每个选择器，使用匿名函数作为处理程序，将值记录到控制台。这些选择器的工作方式如下所示：

    $("#qbostatus").on("click", ".updateqbo", 
        function(){
        console.log($(this).attr('data-customer_id'));
        console.log($(this).attr('data-push'));
        console.log($(this).attr('data-create'));
    });

单击第一个锚标记时生成以下控制台日志：

 1032
 yes
 no

因此，我仍然不明白为什么原始代码将“data-customer_id”、“data push”和“data create”传递给updateQBO（）作为未定义。有什么想法吗？谢谢

试试看

html

用

data-customer\u id='1023'替换
data-customer id='1023'

js

jsfiddle
？很抱歉，{$Customer->Id}应该是“1032”，因为这是第一个请求的响应中实际响应的内容。在
data-*
属性中替换正确的值，jsfiddle是否返回预期结果？是，但我真正的问题是，第一个代码块中的处理程序为这些属性返回未定义的值。看一看，虽然我不知道为什么它会显示不理解的引用错误。它在我的机器上不这样做，因为在发送之前，
？
 1032
 yes
 no

$(function() {
var updateQBO = function updateQBO(event) {
        var data = $(event.target).data();
        console.log(data);
        $.ajax({
            type: "POST",
            async: true,                
            url: "/echo/json/",
            success: function(result){
                // $("#qbostatus").html(result);
            },
            data: {json:JSON.stringify({
                create: data.create,
                push: data.push,
                id: data.customerid,
                fname: $("input[name='fname']").val(),
                lname: $("input[name='lname']").val(),
                email: $("input[name='email']").val(),
                street_address: $("input[name='street_address']").val(),
                city: $("input[name='city']").val(),
                state: $("input[name='state']").val(),
                zip: $("input[name='zip']").val(),
                phoneam: $("input[name='phoneam']").val(),
                phonepm: $("input[name='phonepm']").val()
            })},
            beforeSend: function(jqXHR, settings) {
              var data = JSON.parse(
                           decodeURIComponent(settings.data.split(/=/)[1])
                         );
              console.log(jqXHR, settings);
              console.log(data.create, data.push, data.id);
            }       
        });         
    };

    var elem = $("#qbostatus");
    elem.on("click", ".updateqbo",updateQBO);
});