Javascript jQuery-hide（）无法在Internet Explorer 9兼容模式下工作
我有一个问题，隐藏和显示李元素与。我的代码在Chrome和InternetExplorer9中工作，但如果InternetExplorer9进入兼容模式，或者设置为较低的浏览器，它会自动失败 这个想法是有一个下拉列表，按类过滤，并将结果分页。对于下面的示例，我已经删除了大部分分页代码 据我所知，问题在于Javascript jQuery-hide（）无法在Internet Explorer 9兼容模式下工作,javascript,jquery,internet-explorer-9,Javascript,Jquery,Internet Explorer 9,我有一个问题，隐藏和显示李元素与。我的代码在Chrome和InternetExplorer9中工作，但如果InternetExplorer9进入兼容模式，或者设置为较低的浏览器，它会自动失败 这个想法是有一个下拉列表，按类过滤，并将结果分页。对于下面的示例，我已经删除了大部分分页代码 据我所知，问题在于selector.children（）.hide（），尽管我对此不确定 我通过验证器运行了HTML，看起来很好，而Chrome工具中没有JavaScript错误，InternetExplorer开
selector.children（）.hide（），尽管我对此不确定
我通过验证器运行了HTML，看起来很好，而Chrome工具中没有JavaScript错误，InternetExplorer开发工具中也没有明显的错误（尽管我对这些工具不太熟悉，可能会遗漏一些东西）
如果您将下面的内容保存到HTML文件中，您应该会得到一个下拉列表，当选中该下拉列表时，它会过滤li
元素。至少在铬中：
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<script>
//<![CDATA[
function buildPaging(filterClass) {
var selector = $('.paging');
selector.wrap("<div class='simplePagerContainer'></div>");
var pageSize = 2;
var pageCounter = 1;
var currentPage = 1;
var step =0;
selector.children().each(function (i) {
var item = $(this);
var hasClass = false;
if (filterClass !== undefined &&
filterClass !== '' &&
filterClass !== 'Sites:' &&
item.hasClass(filterClass)) {
hasClass = true;
}
else
if (filterClass === undefined ||
filterClass === '' ||
filterClass === 'Sites:') {
hasClass = true;
}
if (step < pageCounter * pageSize && step >= (pageCounter - 1) * pageSize && hasClass) {
$(this).addClass("simplePagerPage" + pageCounter);
step++;
}
else
if (hasClass) {
$(this).addClass("simplePagerPage" + (pageCounter + 1));
pageCounter++;
step++;
}
});
selector.children().hide();
selector.children(".simplePagerPage" + currentPage).show();
};
function cleanPaging() {
$('li').removeClass('simplePagerPage1 simplePagerPage2 simplePagerPage3 simplePagerPage4 simplePagerPage5 simplePagerPage6 simplePagerPage7 simplePagerPage8')
$('.simplePagerNav').remove();
}
$(document).ready(function() {
buildPaging();
});
var selectedItem;
function hideMessage(period) {
var classList = $('.EMI_Message_Option');
selectedItem = period;
var keep;
for (var i = 0; i < classList.length; i++) {
if (classList[i].innerHTML !== period) {
$('.' + classList[i].innerHTML).hide();
}
else {
keep = classList[i].innerHTML;
}
}
$('.' + keep).show();
cleanPaging();
buildPaging(period);
}
//]]>
</script>
<div class="EMI_Messages">
<div class="EMI_Messages">
<div class="MessageDropdown">
<select onchange="hideMessage(this.value)">
<option>Sites:</option>
<option>CSR</option>
<option>Sales</option>
</select>
</div>
<ul class="paging">
<li class="CSR">
<div>
<div>
<a href="http://example.com/">CSR</a>
</div>
<div>byline</div>
<div>11/26/2012 12:00:00 AM</div>
</div>
</li>
<li class="Sales">
<div>
<div>
<a href="http://example.com/">Sales</a>
</div>
<div>sample text</div>
<div>11/21/2012 12:00:00 AM</div>
</div>
</li>
</ul>
</div>
<div class="pager"></div>
</div>
</body>
</html>
试验
//=（页面计数器-1）*页面大小和级别（&H）{
$（this.addClass（“simplePagerPage”+pageCounter）；
step++；
}
其他的
如果（hasClass）{
$（this.addClass（“simplePagerPage”+（pageCounter+1））；
pageCounter++；
step++；
}
});
selector.children（）.hide（）；
selector.children（“.simplePagerPage”+currentPage.show（）；
};
函数cleanPaging（）{
$（'li'）.removeClass（'SimplePage1 SimplePage2 SimplePage3 SimplePage4 SimplePage5 SimplePage6 SimplePage7 SimplePage8'）
$（'.simplePagerNav'）.remove（）；
}
$（文档）.ready（函数（）{
buildPaging（）；
});
var-selectedItem；
函数隐藏消息（句点）{
var classList=$（'.EMI_Message_Option'）；
选择editem=期间；
var保持；
对于（var i=0；i
地点：
企业社会责任
销售额
-
署名行
2012年11月26日12:00:00上午
-
示例文本
2012年11月21日12:00:00上午
问题似乎是由这段HTML引起的：
<select onchange="hideMessage(this.value)">
仅供参考，以下是您在JSFIDLE中应用修复程序的代码：
现在我们看到了问题所在，您可以在这里看到类似的问答：
与您所问的问题无关，您是否意识到每次调用buidPaging（）
，它都会执行一个额外的.wrap（“”）所以每次调用DOM时，您的DOM结构都会变得更深？谢谢@jfriend00这正是问题所在。很抱歉花了这么长时间，我在工作结束时问了这个问题，然后才进去（在英国）。
<select onchange="hideMessage(this.options[this.selectedIndex].value)">