Я не могу «отметить» флажок ввода, встроенный в расширяемую UL. Я знаю, что причина как-то связана с привязкой кликов, но я просто не могу этого понять.
UL является динамическим, поэтому я добавляю новые li и UL. UL самого низкого уровня содержит списки, которые должны быть доступны для выбора. Однако, когда я пытаюсь щелкнуть по ним, он просто выделяет метку, и флажок никогда не устанавливается.
Вот HTML:
<li id="JeffID4" class="collapsed expanded">
Assessment
<ul class="inputs-list" style="display: block;">
<li id="apple">
<label class="checkbox inline">
<input type="checkbox">
ATGM
</label>
</li>
<li id="apple">
<label class="checkbox inline">
<input type="checkbox">
FMS
</label>
</li>
</ul>
</li>
Вот javascript/jquery:
function prepareList() {
$('#expList').find('li:has(ul)')
.click( function(event) {
//If line item is expandable but has no line items then call the service to retrieve data
if($(event.target).hasClass('collapsed') && $(event.target).find('li').length==0){
$(event.target).children('ul').append("Add New LI's")
$('#expList').find('li:has(ul)').addClass('collapsed');
$('#expList').find('ul').addClass('inputslist'); $(event.target).find('li:has(input)').unbind();
$(event.target).children('ul').hide();
}
//Toggle the lists if they show or not
$(event.target).toggleClass('expanded');
$(event.target).children('ul').slideToggle('medium');
return false;
})
.addClass('collapsed').removeClass('expanded').children('ul').hide();
};
$(document).ready( function() {
prepareList()
});
return false;
из обработчика кликов останавливает поведение по умолчанию для клика, так что... почему вы возвращаете false? Вы можете добавитьif (event.target.tagName.toLowerCase()==="input") return;
(безfalse
) в начало вашего обработчика кликов, чтобы остановить дальнейшую обработку при нажатии на ввод (включая флажки). Илиif ($(event.target).is("input")) return;
, если вы думаете, что в моем первом предложении недостаточно jQuery... - person nnnnnn   schedule 25.08.2012