jQuery可以';无法访问此内部更改事件

jQuery可以';无法访问此内部更改事件,jquery,Jquery,我在尝试获取外部组合框更改事件上的级联组合框时遇到问题。您可以从表中添加和删除行,以便可以有任意数量的行。每行内有2个组合框。1代表客户,1代表联系人。我在customer组合框上触发了一个change事件,该组合框将启动并提取该客户的有效联系人。下面是表格的html <tr class="ClassAttendee"> <td> <select class="Customers valid" id="Attendees_0__Customers

我在尝试获取外部组合框更改事件上的级联组合框时遇到问题。您可以从表中添加和删除行,以便可以有任意数量的行。每行内有2个组合框。1代表客户,1代表联系人。我在customer组合框上触发了一个change事件,该组合框将启动并提取该客户的有效联系人。下面是表格的html

<tr class="ClassAttendee">      
<td>
    <select class="Customers valid" id="Attendees_0__Customers"
    name="Attendees[0].Customers">    
        <option value="1517">Woodstock</option>
        <option value="1518">Woolwich</option>
        <option value="1519">Yarmouth</option>
        <option value="1520">York</option>
    </select>
</td>
<td>
     <select class="Contact">
         <option value="">Choose Attendee...</option>
     </select>
</td>
<td>
     <input data-val="true" data-val-required="The Attended field is required."
     id="Attendees_0__Attended" name="Attendees[0].Attended" type="checkbox"
     value="true"><input name="Attendees[0].Attended" type="hidden" value="false">
     <span class="field-validation-valid" data-valmsg-for="nestedObject.Attended" data
     -valmsg-replace="true"></span>
</td>
<td>
     <input class="FeePaid" data-val="true" data-val-required="The Fee Paid field is
     required." id="Attendees_0__FeePaid" name="Attendees[0].FeePaid" type="checkbox"
     value="true"><input name="Attendees[0].FeePaid" type="hidden" value="false">
     <span class="field-validation-valid" data-valmsg-for="nestedObject.FeePaid" data
     -valmsg-replace="true"></span>
</td>
<td>
     <input class="CheckNumber" id="Attendees_0__CheckNumber"
     name="Attendees[0].CheckNumber" type="text" value="">

     <span class="field-validation-valid" data-valmsg-for="nestedObject.CheckNumber"
     data-valmsg-replace="true"></span>
</td>
<td>
    <input class="mark-for-delete" data-val="true" data-val-required="The Delete field
    is required." id="Attendees_0__Delete" name="Attendees[0].Delete" type="hidden"
    value="False">

    <a href="#"
    onclick="javascript:removeNestedForm(this,'tr.ClassAttendee','input.mark-for
    -delete');return false;">Remove</a>
</td>
</tr>
如果我使用选择器首先选择客户下拉框而不是使用此框,然后使用该行的其余部分,我可以选择联系人下拉框。我不明白为什么这不起作用,如果我不能使用this对象,我也不知道如何在我处理的行上为变更事件选择特定的下拉列表


任何想法都将不胜感激

这是一个经典问题:
这个
引用函数调用的上下文,对于大多数回调来说,它是
窗口

解决方案:

    if (selectedCustomer != null && selectedCustomer != '') {
        var that = this;
        $.getJSON('@Url.Action("GetAllSelectedCustomer", "CustomerEmails")', { id: selectedCustomer }, function (contacts) {
            var contactSelect = $(that).parent().next().children(".Contact");
尝试使用闭包:

$('.Customers').change(function (e) {
    var selectedCustomer = $(this).val();
    if (selectedCustomer != null && selectedCustomer != '') {
        (function(el) {
            $.getJSON('@Url.Action("GetAllSelectedCustomer", "CustomerEmails")', { id: selectedCustomer }, function (contacts) {
                var contactSelect = $(el).parent().next().children(".Contact");
                contactSelect.empty();
                $.each(contacts, function (index, contact) {
                    contactSelect.append($('<option/>', {
                        value: contact.ID,
                        text: contact.Name
                    }));
                });
            });
        })(this);
    }
});
$('.Customers')。更改(功能(e){
var selectedCustomer=$(this.val();
if(selectedCustomer!=null&&selectedCustomer!=''){
(功能(el){
$.getJSON('@Url.Action(“GetAllSelectedCustomer”,“CustomerEmails”),{id:selectedCustomer},函数(联系人){
var contactSelect=$(el.parent().next().children(“.Contact”);
contactSelect.empty();
$。每个(联系人,功能(索引,联系人){
contactSelect.append($(''){
值:contact.ID,
文本:contact.Name
}));
});
});
})(本条);
}
});

您已经在JavaScript中发现了功能范围。感谢您的回答。他们都解决了这个问题,但我想我更喜欢用封闭的方式来做变量。对我来说,解释似乎更简洁。一旦我读了你写的东西,我就明白我错在哪里了。
    if (selectedCustomer != null && selectedCustomer != '') {
        var that = this;
        $.getJSON('@Url.Action("GetAllSelectedCustomer", "CustomerEmails")', { id: selectedCustomer }, function (contacts) {
            var contactSelect = $(that).parent().next().children(".Contact");
$('.Customers').change(function (e) {
    var selectedCustomer = $(this).val();
    if (selectedCustomer != null && selectedCustomer != '') {
        (function(el) {
            $.getJSON('@Url.Action("GetAllSelectedCustomer", "CustomerEmails")', { id: selectedCustomer }, function (contacts) {
                var contactSelect = $(el).parent().next().children(".Contact");
                contactSelect.empty();
                $.each(contacts, function (index, contact) {
                    contactSelect.append($('<option/>', {
                        value: contact.ID,
                        text: contact.Name
                    }));
                });
            });
        })(this);
    }
});