2

我有一个公司表格列表，表格列表中每个公司名称旁边都有一个 [+] 按钮。当用户单击 [+] 时，javascript 函数使用 jquery ajax 获取并在单击的行下方附加一个新的表格行，然后将显示一个缩进的部门列表。

一切都很好......直到我们到达我们心爱的IE。我使用的是 IE 8，没有在以前的版本上尝试过。

点击前的表格列表项 HTML：

<tr id="row1">
<td align="center">
<div id="button1" class="on" onclick="javascript:expandDepartments(1)"></div>
</td>
<td>Company 1</td>
</tr>

onClick 函数：

    <script>
    function expandDepartments(s_cid) {
        if ($('#button'+s_cid+'').hasClass('on')) {
            $('#button'+s_cid+'').removeClass('on').addClass('off');
            if ( document.getElementsByName('rowafter'+s_cid+'').length == 0) { //if the department list does not exist for this company (first time getting departments)

                $.ajax({
                    type: 'POST',
                    url: 'ajax/common.php',
                    dataType: 'html',
                    data: 'a=getHomePageDepartments&cid='+s_cid+'',
                    success: function(txt){
                        setTimeout(function(){
                            $('#homeCompaniesList tbody').find('#row'+s_cid+'').after(txt);
                        },1000);
                    }
                });

            }else{ //otherwise, just re-show the row again, no need to request it again

                setTimeout(function(){
                    var x = document.getElementsByName('rowafter'+s_cid+'');
                    for(var k=0;k<x.length;k++)
                        x[k].style.display = '';
                    },1000);

            }

        } else if ( $('#button'+s_cid+'').hasClass('off') ) { //hide the row when MINUS image clicked

            $('#button'+s_cid+'').removeClass('off').addClass('on');
            var x = document.getElementsByName('rowafter'+s_cid+'');
            alert(x.length);
            for(var k=0;k<x.length;k++)
                x[k].style.display = 'none';

        }
    }
</script>

包含多个部门的公司的 HTML 输出：

<tr style="display:;" name="rowafter1"><*td data not important*..
<tr style="display:;" name="rowafter1">
<tr style="display:;" name="rowafter1">
<tr style="display:;" name="rowafter1">
<tr style="display:;" name="rowafter1">

现在，看看 javascript 函数，行：alert(x.length);

在 Firefox 中，它会提示 5 在 IE 中，它会提示 0

这告诉我，在 IE 中无法访问使用 jquery ajax 注入页面的 HTML 元素，我不知道为什么。我需要为ie设置一个ajax参数吗？不确定..请协助。

ta

4

2 回答 2

2

IE 有问题getElementsByName

或者，为什么不使用 jQuery？

var x = $('*[name="rowafter'+s_cid+'"]'); //get all elements with name rowafterN
于 2012-06-13T10:34:43.930 回答
1

getElementsByName()在 < IE9 中不起作用。如果您使用的是 jQuery，请使用attribute选择器：

var x = $('[name="rowafter' + s_cid + '"]');
alert(x.length);
于 2012-06-13T10:35:12.197 回答