использование jQuery с пользовательскими элементами формы

Question

. Я использую пользовательские элементы формы в форме.

<fieldset>
  <legend id="Cities">Cities</legend>
  <div class="legend-underline"></div>
  <div class="filters" id="Cities-filters">
  <div>
   <span class="checkbox" style="background-position: 0pt -34px;"></span>
   <input type="checkbox" value="Adelaide" class="styled" name="sidecity" id="sidecity-control-name-0">
   <label for="sidecity-control-name-0">Adelaide (58)</label>
  </div>                    
</fieldset>

[Update]

var inputs = $('.filters-widget.bordered div[class!="filters"]');
 inputs.each(function (index, element) { 
$(element).click("click", function () {
 console.log(element); 
});
 }); 

Когда я нажимаю на div, метод log () вызывается дважды.

Как решить эту проблему?

Answer 1

Вы хотите создать пользовательские элементы из разметки?Плохая идея.Попробуйте включить элемент в вашу разметку после настройки отображения его css: нет.Используйте событие изменения элемента, чтобы определить, как показывать элемент разметки.

Это то, что делают пользовательский интерфейс jquery и Uniform.Проверьте их

Answer 2

попробуйте .on функцию после стилизации флажков

Answer 3

Привязать обработчик события к флажку click событие. Вы можете определить, установлен флажок или нет, проверив атрибут checked в вашем обработчике:

$('#sidecity-control-name-0').click(function() {
    console.log(this.checked);
});

http://jsfiddle.net/qgR42/