Совместимость браузера jQuery (IE)

Поскольку исходный код, который я пытаюсь показать вам, довольно длинный и сложный, я просто собираюсь предоставить ссылку на страницу, с которой у меня возникают проблемы.

http://www.thesportinghub.com/lms/make-my-picks

Если вы работаете с этим скриптом в Google Chrome или в последних версиях Firefox (5 или 6), вы заметите, как JQuery в этом скрипте предназначен для работы. Он работает именно так, как я хочу, чтобы он работал в этих браузерах.

Тем не менее, в настоящее время у меня возникают проблемы с выяснением, почему он не работает корректно в IE6, IE7 и IE8 … Я готов сказать «что угодно» для IE6, но я действительно надеюсь, что это будет работать в IE7 и IE8 , Просмотрев мой исходный код, есть ли что-то, что вы можете видеть, что вызывает проблемы в IE7 и IE8.

Основная проблема (как вы заметите, когда вы играете с jQuery в Chrome, а затем в IE), это то, что когда команда нажата, она отключит поле ввода и ударит по этой команде в течение оставшейся недели , Однако вход отключен правильно в IE, но забастовка (addClass в jQuery) не работает.

Я готов предоставить дополнительную информацию … Я еще не хочу перегружать информацию. Но это была проблема, которую я пытался исправить уже несколько часов.

Спасибо заранее за вашу помощь. Я приму самый лучший ответ и проголосую! Благодаря!

ОБНОВЛЕНИЯ С КОДОМ НИЖЕ

Вот мой текущий код javascript / jquery:

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function () { $('.radio:checked').addClass("selected"); $('.pickbox').text($('.radio:checked').val()); var selected_week = $('#weekselect').val(); $('table.weekbox').hide(); $('table#weekbox' + selected_week).show(); $('span.selection.text').html('<br/>My Week ' + selected_week + ' Selection:'); $('input.radio').change(function () { $('.teambox').find('span.strike').removeClass('strike'); var selected = $(this).val(); var us_selected = selected.replace(/ /g, ""); $('.radio:not(:checked)').removeClass('selected'); $('.radio:not(:checked)').next('span').css('color', ''); $('.radio:not(:checked)').removeAttr('disabled'); $('.radio:checked').addClass('selected'); $('.pickbox').text($(this).val()); $('.pickbox').css('border', '3px dashed #88cc33'); //$('.pickbox').text($('.teambox').find('span.' + us_selected).text()); $('.teambox').find('span.' + us_selected).addClass('strike'); $('.selected').each(function () { var selected_team = $(this).val(); var x_selected_team = selected_team.replace(/ /g, ""); $('.teambox').find('span.' + x_selected_team).text(selected_team).addClass('strike'); $('table.weekbox').find('td input[value="' + selected_team + '"]').attr('disabled', 'disabled'); $('.selected').next('span').css('color', '#88cc33'); }); }); $('#weekselect').change(function () { var selected_week = $('#weekselect').val(); if ($('input[name="Week' + selected_week + '"]').is(':not(:checked)')) { $('table.weekbox').hide(); $('table#weekbox' + selected_week).show(); $('span.selection.text').html('<br/>My Week ' + selected_week + ' Selection:'); $('.pickbox').css('border', '1px dashed #FFFFFF'); $('.pickbox').text(''); } $('table.weekbox').hide(); $('table#weekbox' + selected_week).show(); $('span.selection.text').html('<br/>My Week ' + selected_week + ' Selection:'); $('input:not(:checked)').next('span').removeClass('strike'); $('input[disabled]:not(:checked)').next('span').addClass('strike'); $('.pickbox').text($('input.radio[name="Week' + selected_week + '"].selected').val()); if ($('.pickbox').text() != "") { $('.pickbox').css('border', '3px dashed #88cc33'); } $('.selected').each(function () { var selected_team = $(this).val(); var x_selected_team = selected_team.replace(/ /g, ""); $('.teambox').find('span.' + x_selected_team).text(selected_team).addClass('strike'); }); }); }); </script> 

Вот некоторые из элементов DOM, которые этот jQuery должен затрагивать:

 <table id="weekbox1" class="weekbox" cellpadding="5" cellspacing="1" bgcolor="#000000" width="100%"> <tr> <td class="three" colspan="4">Week 1</td> </tr> <tr> <td class="one">Date</td> <td class="one">Away Team</td> <td class="one">Home Team</td> <td class="one">Time (EST)</td> </tr> <tr> <td class="two">09/08/11</td> <td class="two"> <input type="radio" id="New Orleans Saints" class="radio" name="Week1" value="New Orleans Saints"></input> <span>New Orleans Saints</span> </td> <td class="two"> <input type="radio" id="Green Bay Packers" class="radio" name="Week1" value="Green Bay Packers"></input> <span>Green Bay Packers</span> </td> <td class="two">8:30 PM</td> </tr> <tr> <td class="two">09/11/11</td> <td class="two"> <input type="radio" id="Atlanta Falcons" class="radio" name="Week1" value="Atlanta Falcons"></input> <span>Atlanta Falcons</span> </td> <td class="two"> <input type="radio" id="Chicago Bears" class="radio" name="Week1" value="Chicago Bears"></input> <span>Chicago Bears</span> </td> <td class="two">1:00 PM</td> </tr> <tr> <td class="two">09/11/11</td> <td class="two"> <input type="radio" id="Cincinnati Bengals" class="radio" name="Week1" value="Cincinnati Bengals"></input> <span>Cincinnati Bengals</span> </td> <td class="two"> <input type="radio" id="Cleveland Browns" class="radio" name="Week1" value="Cleveland Browns"></input> <span>Cleveland Browns</span> </td> <td class="two">1:00 PM</td> </tr> <tr> <td class="two">09/11/11</td> <td class="two"> <input type="radio" id="Buffalo Bills" class="radio" name="Week1" value="Buffalo Bills"></input> <span>Buffalo Bills</span> </td> <td class="two"> <input type="radio" id="Kansas City Chiefs" class="radio" name="Week1" value="Kansas City Chiefs"></input> <span>Kansas City Chiefs</span> </td> <td class="two">1:00 PM</td> </tr> <tr> <td class="two">09/11/11</td> <td class="two"> <input type="radio" id="Philadelphia Eagles" class="radio" name="Week1" value="Philadelphia Eagles"></input> <span>Philadelphia Eagles</span> </td> <td class="two"> <input type="radio" id="St Louis Rams" class="radio" name="Week1" value="St Louis Rams"></input> <span>St. Louis Rams</span> </td> <td class="two">1:00 PM</td> </tr> <tr> <td class="two">09/11/11</td> <td class="two"> <input type="radio" id="Tennessee Titans" class="radio" name="Week1" value="Tennessee Titans"></input> <span>Tennessee Titans</span> </td> <td class="two"> <input type="radio" id="Jacksonville Jaguars" class="radio" name="Week1" value="Jacksonville Jaguars"></input> <span>Jacksonville Jaguars</span> </td> <td class="two">1:00 PM</td> </tr> <tr> <td class="two">09/11/11</td> <td class="two"> <input type="radio" id="Pittsburgh Steelers" class="radio" name="Week1" value="Pittsburgh Steelers"></input> <span>Pittsburgh Steelers</span> </td> <td class="two"> <input type="radio" id="Baltimore Ravens" class="radio" name="Week1" value="Baltimore Ravens"></input> <span>Baltimore Ravens</span> </td> <td class="two">1:00 PM</td> </tr> <tr> <td class="two">09/11/11</td> <td class="two"> <input type="radio" id="Indianapolis Colts" class="radio" name="Week1" value="Indianapolis Colts"></input> <span>Indianapolis Colts</span> </td> <td class="two"> <input type="radio" id="Houston Texans" class="radio" name="Week1" value="Houston Texans"></input> <span>Houston Texans</span> </td> <td class="two">1:00 PM</td> </tr> <tr> <td class="two">09/11/11</td> <td class="two"> <input type="radio" id="Detroit Lions" class="radio" name="Week1" value="Detroit Lions"></input> <span>Detroit Lions</span> </td> <td class="two"> <input type="radio" id="Tampa Bay Buccaneers" class="radio" name="Week1" value="Tampa Bay Buccaneers"></input> <span>Tampa Bay Buccaneers</span> </td> <td class="two">1:00 PM</td> </tr> <tr> <td class="two">09/11/11</td> <td class="two"> <input type="radio" id="New York Giants" class="radio" name="Week1" value="New York Giants"></input> <span>New York Giants</span> </td> <td class="two"> <input type="radio" id="Washington Redskins" class="radio" name="Week1" value="Washington Redskins"></input> <span>Washington Redskins</span> </td> <td class="two">4:15 PM</td> </tr> <tr> <td class="two">09/11/11</td> <td class="two"> <input type="radio" id="Carolina Panthers" class="radio" name="Week1" value="Carolina Panthers"></input> <span>Carolina Panthers</span> </td> <td class="two"> <input type="radio" id="Arizona Cardinals" class="radio" name="Week1" value="Arizona Cardinals"></input> <span>Arizona Cardinals</span> </td> <td class="two">4:15 PM</td> </tr> <tr> <td class="two">09/11/11</td> <td class="two"> <input type="radio" id="Minnesota Vikings" class="radio" name="Week1" value="Minnesota Vikings"></input> <span>Minnesota Vikings</span> </td> <td class="two"> <input type="radio" id="San Diego Chargers" class="radio" name="Week1" value="San Diego Chargers"></input> <span>San Diego Chargers</span> </td> <td class="two">4:15 PM</td> </tr> <tr> <td class="two">09/11/11</td> <td class="two"> <input type="radio" id="Seattle Seahawks" class="radio" name="Week1" value="Seattle Seahawks"></input> <span>Seattle Seahawks</span> </td> <td class="two"> <input type="radio" id="San Francisco 49ers" class="radio" name="Week1" value="San Francisco 49ers"></input> <span>San Francisco 49ers</span> </td> <td class="two">4:15 PM</td> </tr> <tr> <td class="two">09/11/11</td> <td class="two"> <input type="radio" id="Dallas Cowboys" class="radio" name="Week1" value="Dallas Cowboys"></input> <span>Dallas Cowboys</span> </td> <td class="two"> <input type="radio" id="New York Jets" class="radio" name="Week1" value="New York Jets"></input> <span>New York Jets</span> </td> <td class="two">8:20 PM</td> </tr> <tr> <td class="two">09/12/11</td> <td class="two"> <input type="radio" id="New England Patriots" class="radio" name="Week1" value="New England Patriots"></input> <span>New England Patriots</span> </td> <td class="two"> <input type="radio" id="Miami Dolphins" class="radio" name="Week1" value="Miami Dolphins"></input> <span>Miami Dolphins</span> </td> <td class="two">7:00 PM</td> </tr> <tr> <td class="two">09/12/11</td> <td class="two"> <input type="radio" id="Oakland Raiders" class="radio" name="Week1" value="Oakland Raiders"></input> <span>Oakland Raiders</span> </td> <td class="two"> <input type="radio" id="Denver Broncos" class="radio" name="Week1" value="Denver Broncos"></input> <span>Denver Broncos</span> </td> <td class="two">10:15 PM</td> </tr> </table> 

Как уже упоминалось выше , вероятно, проще перейти к прилагаемой ссылке (см. Выше). Я отправил вас всех и попытался сначала просмотреть код в Chrome (и посмотреть, как он работает, как я ожидаю, что он будет работать), а затем попробовать его в IE 6 – IE 8 и обратите внимание, как он не делает все, что я хочу, чтобы он делал.

С нетерпением ждем всей помощи, которую вы можете мне предоставить!

ОБНОВИТЬ

 $('input[disabled]:not(:checked)').next('span').addClass('strike'); 

Я думаю, что вышеприведенный код – вот где моя проблема подходит … есть ли что-то напуганное в том, что мои атрибуты не читаются правильно в IE?

Вам нужно правильно закрыть теги ввода.

 <input type="radio" class="radio" name="Week1" value="New York Jets"></input> //Incorrect <input type="radio" class="radio" name="Week1" value="New York Jets" /> //Correct 

Chrome кажется достаточно умным, чтобы исправить его и рассматривать </input> как часть предыдущего элемента ввода, но если вы попробуете этот jsfiddle в IE, вы увидите, что он считает, что </input> является следующим тегом. $("foo").next("span") будет выбирать только следующий элемент, если это span.

http://jsfiddle.net/v9GaX/1/