Пользовательские кнопки радио - IE убьет меня

Question

Я использую jQuery для настройки некоторых переключателей. У меня есть два разных стиля кнопок, поэтому вы увидите два оператора if, которые ищут эти два разных класса.

Проблема, с которой я столкнулся ПОСТОЯННО, заключается в том, что сценарий отлично работает во ВСЕ, но Internet Explorer. К сожалению, компания, к которой я работаю, обозначила IE8 отраслевым стандартом для всех веб-сайтов, поэтому все, что выходит, должно работать с IE8.

Я посылаю к вам, мой код

HTML для радио кнопки 1

<label class="label_radio-STD happy" for="happy3"><input id="happy3" name="q3" type="radio" value="YES"/></label> 
<label class="label_radio-STD meh" for="meh3"><input id="meh3" name="q3" type="radio" value="INDIFFERENT"/></label> 
<label class="label_radio-STD sad" for="sad3"><input id="sad3" name="q3" type="radio" value="NO"/></label> 

HTML для радио кнопки 2

<label class="label_radio" for="radio0">0<input id="radio0" name="q5" type="radio" value="0"/></label> 
<label class="label_radio" for="radio1">1<input id="radio1" name="q5" type="radio" value="1"/></label> 
><label class="label_radio" for="radio2">2<input id="radio2" name="q5" type="radio" value="2"/></label> 

JQuery, чтобы запустить весь Shaz-бот

<script> 
    function setupLabel() { 
     if ($('.label_check input').length) { 

      $('.label_check').each(function(){ 
       $(this).removeClass('c_on'); 
      }); 

      $('.label_check input:checked').each(function(){ 
       $(this).parent('label').addClass('c_on'); 
      });     
     }; 

     if ($('.label_radio input').length) { 

      $('.label_radio').each(function(){ 
       $(this).removeClass('r_on'); 
      }); 

      $('.label_radio input:checked').each(function(){ 
       $(this).parent('label').addClass('r_on'); 
      }); 
     }; 

     if ($('.label_radio-STD input').length) { 

      $('.label_radio-STD').each(function(){ 
       $(this).removeClass('s_on'); 
      }); 

      $('.label_radio-STD input:checked').each(function(){ 
       $(this).parent('label').addClass('s_on'); 
      }); 
     }; 

    }; 
    $(document).ready(function(){ 
     $('label').click(function(){ 
      setupLabel(); 
     }); 
     setupLabel(); 
    }); 
</script> 

I t выкрикнули ALERTS на каждом IF-заявлении, и они придумали хороший, я выбрасывал ALERTS на EACH-петлях, и они придумали хорошо. Я использовал линию jQuery «$ (« body »). AddClass (« has-js »)» как первая строка функции document.ready, но у html-элемента NEVER был класс has-js. Я также просмотрел код и понял, что мне не нужен он для кода, который я запускал. Но это все еще беспокоит меня, что $ ('body'). AddClass («has-js») никогда не работал.

Может ли быть так же просто, как мой javascript для IE8 отключен? Если да, могу ли я заставить его для всех, кто может его отключить?

Answer 1

Это неработающий код от Murphy. http://jsfiddle.net/GRstu/10/

Обратите внимание на строку CSS в скрипте input[type=radio]{display:none;}. Эта строка приведет к тому, что радиокнопка не будет проверена/снята, если щелкнуть метку. Это именно то, как работает IE. Вам нужно будет сделать обходной путь, чтобы проверить скрытое радио при щелчке соответствующего ярлыка.

Вы можете сделать это, добавив строку в событие щелчка:

$('label').click(function() { 
    $(this).children("input").prop("checked", true); //This is the key 
    setupLabel(); 
}); 

Вот jsfiddle решения: http://jsfiddle.net/GRstu/11/

Обратите внимание, что это аналогичное решение и проблема, что перенесенный в этом вопросе: Labels and hidden fields in Internet Explorer (and jquery)

Answer 2

Вы можете вставить тэг <noscript> в свой html, чтобы отобразить сообщение пользователям с выключенным javascript, но вы не можете активировать их для себя на веб-странице.

Э.Г.

<noscript> Enable javascript! </noscript> 

Однако, так как вы находитесь в корпоративной среде, ваш системный администратор может создать Group Policy, чтобы включить Javascript в настройках Internet Explorer всех пользователей.