В FF это скрывает все отделения и затем показывает идентификатор, который был выбран из '#rule_rule_type' меню, которое является ожидаемым поведением. В IE 8 это не скрывает весь идентификатор отделения:
Однако это ДЕЙСТВИТЕЛЬНО работает в IE 8:
Это грязно. Как я могу очистить это, чтобы быть более кратким и все еще работать в IE 8?
Спасибо,
Замок микросхемы
http://invoicethat.com
Я не видел ваш HTML, но то, как вы назвали и сослались на свои идентификаторы выше, позволяет предположить, что вы можете использовать один и тот же идентификатор несколько раз. Просто предположение.
Вы пробовали проверить свой HTML-документ? Не знаю, работает ли это, но еще один способ ...
Что произойдет, если вы добавите класс ко всем DIV, которые вы показываете и скрываете, а затем используете этот слегка перефразированный код? В этом примере вы должны добавить classofalldivs в качестве класса к тем div, на которые вы хотите повлиять:
(function($){
$('#rule_rule_type').change(function() {
var id = $(this).val();
$('#' + id).show();
$('.classofalldivs:not(' + '#' + id+ ')').hide();
});
})(jQuery);
Здесь используется псевдоселектор «not», чтобы скрыть все, кроме того div, который вы показываете, и дает шанс работает как в IE, так и в FF.
Сказав это, я согласен с другими предположениями, что ваш исходный код не выглядит неправильным, поэтому могут происходить другие странные вещи. Можете ли вы опубликовать полный и полный пример вашей проблемы, чтобы другие могли воспроизвести ее?
Я отлично запускаю ваш образец в IE8 и Chrome. Он чем-то отличается?
<!DOCTYPE html>
<html lang="en">
<head>
<title>jQuery Sandbox</title>
</head>
<body>
<select id='rule_rule_type'>
<option value="allowed_senders">allowed_senders</option>
<option value="blocked_senders">blocked_senders</option>
<option value="blocked_character_set">blocked_character_set</option>
<option value="custom">custom</option>
</select>
<hr />
<div id="allowed_senders">#allowed_senders</div>
<div id="blocked_senders">#blocked_senders</div>
<div id="blocked_character_set">#blocked_character_set</div>
<div id="custom">#custom</div>
<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
$(function () {
$('#rule_rule_type').change(function () {
$('#allowed_senders, #blocked_senders, #blocked_character_set, #custom').hide();
var id = $(this).val();
$('#' + id).show();
});
});
</script>
</body>
</html>