表单提交后jQuery变量范围未定义

Question

我正在为我想要发布的id点击一个数据属性，如果我console.log（）我的id IO可以看到它，但我有一个表单的提交函数，数据在这里是未定义的。。。不知道为什么，这是我的代码：

$('[data-id="add_child_notification"]').unbind().bind('click', function(){
    var data = [];
    var message;
    var parent_id;
    var user_id;
    parent_id  = $(this).attr('data-parent-id');
    user_id = $(this).attr('data-user-id');
    data.push({ name: 'parent_id', value : parent_id, nameUid: 'user_id', valueUid : user_id });
    console.log('before: '+parent_id);
    $('[data-form="send_child_notification"]').unbind().bind('submit', function(){
        console.log('after: '+data[1].parent_id);
        message = $('[data-input="child-message-textarea"]:last').val();
        console.log('msg: '+message);
        data.push({ nameMsg: 'message', valueMsg: message });
        $.post(URL+'notifications/send_child_notification', data, function(e){
        if(e.status){
            $('body').append('<div class="success_box"><span class="glyphicon glyphicon-thumbs-up"></span><p>Notification sent</p></div>');
                $('.success_box').delay(1000).fadeOut();
                window.location = window.location.href;
            } else {
                alert(e);
                //alert('Uh oh! Something went wrong, please try again..');
            }
        });
    });
});

Answer 1

data是一个包含对象的数组。

data == [ {name: 'parent_id', value : parent_id, name: 'user_id', value : user_id } ]

所以你必须使用data[0].value，这个值就是parent_id。

编辑1:

正如James所注意到的，"value"键被定义了两次，所以最后一次定义它会覆盖前一次，您将得到user_id。

就这一点而言，"名称"也被定义了两次。

换句话说，你的设计有一个缺陷，你无法达到parent_id。用类似的东西来纠正双击定义

data.push({ name: 'parent_id', value : parent_id, uidName : 'user_id', uidValue : user_id })

编辑2:

事实上，你正在构建一组对象，但我看到它非常笨拙，你真的不知道自己要去哪里。你正在构建这样的东西：

data == [ { name: 'parent_id', value : parent_id, nameUid: 'user_id', valueUid : user_id },
{ nameMsg: 'message', valueMsg: message } ]

这几乎是方便和标准的。我想你想要这个数据对象：

data == {
     'parent_id' : parent_id,
     'user_id' : user_id,
     'message' : message }

因此，只需使用data.parent_id或data.message即可访问属性。

如果是，请执行以下操作：

$('[data-id="add_child_notification"]').unbind().click( function(){
    var data = {
         'parent_id' : $(this).data('parent-id'),
         'user_id' : $(this).data('user-id')
    }
    $('[data-form="send_child_notification"]').unbind().submit( function(){
         data.message = $('[data-input="child-message-textarea"]:last').val();
         $.post(URL+'notifications/send_child_notification', data, function(e){
           ....

此外，像$('[data-input="child-message-textarea"]:last')这样的选择器看起来也很笨拙，但由于您没有发布任何HTML代码，所以很难猜测正确的和正确的。

Answer 2

事实证明，我与范围无关，而是我使用jQuery声明了一个对象，而不能推送到对象。相反，你需要给一个对象分配一个var，比如：

data.user_id = user_id;
data.message = message;

在这样做之后，我的vars被正确定义，一切都正常！

谢谢你的帮助！