jQuery и использование переменных и функций

Question

Я работаю над программой оценки jquery, которая находится в теге формы. Когда я закончу, это будет довольно большой скрипт. Во многих случаях у меня есть около 50 флажков в группе, которые при проверке будут продвигать слайдер ui на один шаг вперед. Если я сниму галочку, он переместит ползунок назад.

Ящики все спрятаны, пока я не нажму на переключатель, который отображает флажки, в то же время прочитает, сколько флажков проверяется и возвращает номер ползунку.

У меня есть функция, которая также корректирует общую расчетную цену каждый раз, когда флажок установлен или снят.

Смысл это форма ...... У меня есть файл contact.php, который будет извлекать всю информацию из формы и отправляться по электронной почте владельцу веб-сайта.

Теперь Большой вопрос ....... у меня есть 50 или флажков ...

Образец HTML

<input type="checkbox" id="R_C-helpPage01" name="helpPage01" value="helpPage01" class="R_C R_C-width20" /> 
    <label id="R_C-helpPage01" class="W_E"></label> 

    <input type="checkbox" id="R_C-helpPage02" name="R_C-helpPage02" value="helpPage02" class="R_C R_C-width20" /> 
    <label id="R_C-helpPage02" class="R_C"></label> 

    <input type="checkbox" id="R_C-helpPage03" name="R_C-helpPage03" value="helpPage03" class="R_C R_C-width20" /> 
    <label id="R_C-helpPage03" class="R_C"></label> 

Образец некоторых вар

var helpPage01 = 'Home Page'; 
var helpPage02 = 'About Us'; 
var helpPage03 = 'Our Services'; 
var helpPage04 = 'Contact Us'; 

Hear является основной функцией я не уверен, как сделать все эти кнопки проверки используют только эту функцию чтобы сделать 50 копий функции для каждого флажка.

Моя первая догадка что-то вроде этого ниже

$('#And 47 more ID's, #helpPage03, #helpPage02, #helpPage01').click(function() 
                   and bla bla bla 

функции как сейчас ..

  $helpPage.click(function() { 
    if ($pages.val() == 20) { 
    alert('Please call for a bulk estimate: ' + phoneNumber); 
      return false; 
      } 

if ($helpPage.is(':checked')) 
      { 
    var s = $pageSlider, 
      val = s.slider("value"), 
      step = s.slider("option", "step"); 
      s.slider("value", val + step); 
      $pages.val(("value", val + step)); 
      $amount.val([("value", val + step) * pageAmount]/[$daySlider.slider("value")]); 
      $slideCalc.click(); 
      } 

else { 
      var s = $pageSlider, 
      val = s.slider("value"),     
      step = s.slider("option", "step");     
      s.slider("value", val - step);   
      $pages.val(("value", val - step));   
      $amount.val([[("value", val - step) * pageAmount]/$daySlider.slider("value")]]); 
      $slideCalc.click(); 
      }     
    }); 

Более

$('#R_C-helpPage01').html(helpPage01 + '<br />'); 
    $('#R_C-helpPage02').html(helpPage02 + '<br />'); 
    $('#R_C-helpPage03').html(helpPage03 + '<br />'); 
      $('#R_C-helpPage04').html(helpPage04 + '<br />'); 

Если вам нужно больше информации, чтобы сделать разумный удар по нему, дайте мне знать.

Answer 1

Для каждого чекбокс вы должны добавить дополнительный отн атрибута и дополнительного класса

<input type="checkbox" rel="1" id="R_C-helpPage01" name="helpPage01" value="helpPage01" class="R_C R_C-width20 helpcb" /> 
    <label id="R_C-helpPage01" class="W_E"></label> 

    <input type="checkbox" rel="2" id="R_C-helpPage02" name="R_C-helpPage02" value="helpPage02" class="R_C R_C-width20 helpcb" /> 
    <label id="R_C-helpPage02" class="R_C"></label> 

    <input type="checkbox" rel="3" id="R_C-helpPage03" name="R_C-helpPage03" value="helpPage03" class="R_C R_C-width20 helpcb" /> 
    <label id="R_C-helpPage03" class="R_C"></label> 

Теперь, вместо того, чтобы связывать этот флажок элемент 50 раз, вы можете просто использовать селектор и связать все галочки к одной функции. Приведенный ниже код выбирает все флажки, которые имеют класс «helpcb»

$('input[type="checkbox"].helpcb').click(function(e){ 
    var id = $(this).attr('rel'); // This will extract the "rel" attribute of the checkbox that was checked 
    // do other stuff 
}); 

Кроме того, вместо определения 50 различных переменных для страниц помощи, вы должны использовать массив

var helpPage = ['About Us', 'Contact Us', 'Other page']; 
alert(helpPage[1]); // Alerts 'contact us'