jQuery ajax 链接选择不工作（该死的你 IE！）但在 FF 中完美工作答案

【问题标题】：jQuery ajax chained selected not working (Darn you IE!) but works perfectly in FFjQuery ajax 链接选择不工作（该死的你 IE！）但在 FF 中完美工作
【发布时间】：2011-03-16 14:12:35
【问题描述】：

我有一个表单，用户输入一个 6 位数字并单击检索按钮。执行 ajax 调用，返回另一种形式的数据（无页面刷新）。在返回的数据中是一个链式选择（如果返回多个项目，则超过一个）。下面是ajax代码。

$(".platform").live("change", function() {
    alert('Updating models...');
    var firstOption = $(this);
    if (firstOption.closest('tr').find('.platform').val() == '')
        {
            firstOption.closest('tr').find('.model').html('<option value=""></option>');                
        }
    else
        {
            firstOption.closest('tr').find('.model').html('<option value="">Updating...</option>');
            $.getJSON("dataCalls/getModels.cfm",{platform: $(this).val()},      
            function(j){
                var options = '';
                for (var i = 0; i < j.length; i++) 
                    {
                        options += '<option value="' + j[i].optionValue + '">' + j[i].optionDisplay + '</option>';
                    }
            firstOption.closest('tr').find('.model').html(options).effect("highlight", {}, 3000);
            });
        }
});

这在 FF 中效果很好，但在 IE7 中却不行。我没有在 IE 8 中测试过。虽然我们正在迁移到 8，但我们公司的标准仍然是 7，所以它需要在 7 中工作。

这是应该触发ajax调用的代码。

<th class="form"><label>Platform / Model</label></th>
        <td> <select class="platform required" name="platform">
                <option ></option>
                <cfloop query="rsPlatform">
                    <option value="#rsPlatform.optionValue#" <cfif rsRequestSystems.platform eq rsPlatform.optionValue>selected</cfif>>#rsPlatform.optionValue# - #rsPlatform.optionDesc#</option>
                </cfloop>
            </select>
            &nbsp; / &nbsp;
            <select class="model required" name="model">
                <option selected></option>
                <cfloop query="rsModels">
                    <option value="#rsModels.optionValue#" <cfif rsRequestSystems.model eq rsModels.optionValue>selected</cfif>>#rsModels.optionDesc#</option>
                </cfloop></select></td>

【问题讨论】：

加载页面时IE7错误控制台有什么错误吗？
是否显示“正在更新...”选项？我在 IE7 上得到了类似的代码，唯一的区别是我没有的效果。
@canuteson 没有错误，没有发生任何类型的操作。
@Louskan - 我刚刚添加了效果。删除它不会改变 IE 的行为。 :(
我添加了alert('Updating models...'); 只是为了查看 IE 是否甚至识别了该事件并且它似乎不知道 .platform 事件。

标签： jquery ajax json select chained

【解决方案1】：

根据问题后面的 cmets，您似乎已将问题范围缩小到事件注册，因为根本没有发生任何事情，甚至没有调用“警报”。

根据following answer 到另一个类似的 SO 问题，看来您正在尝试做的事情，即在“更改”事件上使用 live() 方法，在 IE7 中不起作用。

【讨论】：

看起来你可能是对的。我正在测试另外几个想法。
我发现这个 link 引用了解决我的问题的 livequery。

【解决方案2】：

自从我找到解决方法以来，我正在回答我自己的问题。

我发现这个 link 引用了解决我的问题的 livequery。

$(".platform").livequery("change", function() {
    var firstOption = $(this);
    alert('Updating Modules 302');
    if (firstOption.closest('tr').find('.platform').val() == '')
        {
            firstOption.closest('tr').find('.model').html('<option value=""></option>');                
        }
    else
        {
            firstOption.closest('tr').find('.model').html('<option value="">Updating...</option>');
            alert('Updating Modules 310');
            $.getJSON("index.cfm?do=misc.getModels",{platform: $(this).val()},      
            function(j){
                var options = '';
                for (var i = 0; i < j.length; i++) 
                    {
                        options += '<option value="' + j[i].optionValue + '">' + j[i].optionDisplay + '</option>';
                    }
            firstOption.closest('tr').find('.model').html(options);
            });
        }
});

【讨论】：