Объясните вопрос про Checkbox
$(function (){
$('[position_title ^= 5] label').click(function (){
$('[position_title ^= 5] input:checkbox:checked').each(function(i) {
alert('otme4eno');
});
});
});
Есть такой код, при клике на label checkboxa, checkbox отмечается, но почему input:checkbox:checked не срабатывает сразу на это? у меня например 6 чекбоксов, я отмечаю один 0 реакции, отмечаю другой, и тут о чудо он увидел то что было отмечено в первый раз и вывел мне сообщение "отмечено", WTF? объясните почему он это сразу не может определить? |
cha0s,
когда кликнули первый раз ещё нет :checked |
Цитата:
|
cha0s,
вопрос что вы хотите сделать далее? |
$(function (){
$('[position_title ^= 5] label').click(function (){
var str = '';
$("#fiveselect").html(str);
$('[position_title ^= 5] input:checkbox:checked').each(function(i) {
var text = $(this).next('label').text();
if (text.indexOf('(-$')+1) {
text = text.substring(0,text.indexOf('('));
str += text + " ,";
}
});
$("#fiveselect").append(str);
});
});
Вот полный код, особо можно не вдаваться в подробности фишка такая, что я делаю строку из текста который в label, из-за того что он не может сразу чухнуть что элемент уже :checked когда пользователь тыркнул ломается вся эта строка, то есть код рабочий но он все время на шаге назад... я выбираю уже 2-ой чекбокс отмечаю, а он тока делает строку из предыдущего... НУ то есть он не может сразу определить то что checked уже checked... со 2-ой попытки только видит... мне типа ему надо насильно сделать как-то checked для кода? чтоб он понял это сразу и выполнял цикл уже зная что элемент этот checked... а то что-то не понимаю... Вот скрин видишь строка сверху SELECTED: туда вставляются отмеченные checkbox.... я уже отметил 2-ой чекбокс, и только тогда он в строку добавил первый мой отмеченный.... если выберу 3-тий то добавит только 2-ой.... ТО ЕСТЬ он на ШАГ отстает постоянно... то есть первый шаг :checked все время false, хотя галочка там стоит(сами checkbox display:none;) label сделаны как кнопки=) |
cha0s,
код checkbox-ов с label можно? |
Да генерирует сам движок их, с моими не большими модификациями.
<div id="results5"><div position_title="5" id="option-656" class="option checkbox"> <label style="display:none;">discounts:</label> <div class="fields"> <input style="display:none;" type="checkbox" name="option[656][]" value="6142" id="option-value-6142"> <label class="spancheckbox" style="float:left; margin-bottom:5px;" for="option-value-6142">cardstock layers(-$0.50)</label> <br> <input style="display:none;" type="checkbox" name="option[656][]" value="6149" id="option-value-6149"> <label class="spancheckbox" style="float:left; margin-bottom:5px;" for="option-value-6149">belly band(-$0.25)</label> <br> <input style="display:none;" type="checkbox" name="option[656][]" value="6150" id="option-value-6150"> <label class="spancheckbox" style="float:left; margin-bottom:5px;" for="option-value-6150">ribbon(-$0.50)</label> <br> <input style="display:none;" type="checkbox" name="option[656][]" value="6151" id="option-value-6151"> <label class="spancheckbox" style="float:left; margin-bottom:5px;" for="option-value-6151">pocketfold name tag(-$0.15)</label> <br> <input style="display:none;" type="checkbox" name="option[656][]" value="6152" id="option-value-6152"> <label class="spancheckbox" style="float:left; margin-bottom:5px;" for="option-value-6152">envelope liner(-$0.25)</label> <br> <input style="display:none;" type="checkbox" name="option[656][]" value="6153" id="option-value-6153"> <label class="spancheckbox" style="float:left; margin-bottom:5px;" for="option-value-6153">address wrap(-$0.50)</label> <br> </div> </div></div> |
cha0s,
:write:
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
label{
background: #228B22;
}
input:checked + label {
background: #FF3D3D;
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script>
$(function ()
{
$('[position_title ^= 5] label').click(function (){
var str = [];
var checked = $(this).prev().is(':checked');
var inputs = $('[position_title ^= 5] input:checkbox:checked');
inputs = checked ? inputs.not($(this).prev()) : inputs.add($(this).prev())
inputs.each(function(i) {
var text = $(this).next('label').text();
if (text.indexOf('(-$')+1) {
text = text.substring(0,text.indexOf('('));
str.push(text);
}
});
$("#fiveselect").text(str.join(', '));
});
})
</script>
</head>
<body>
<div id="fiveselect"></div>
<div id="results5"><div position_title="5" id="option-656" class="option checkbox">
<label style="display:none;">discounts:</label>
<div class="fields">
<input style="display:none;" type="checkbox" name="option[656][]" value="6142" id="option-value-6142">
<label class="spancheckbox on" style="float:left; margin-bottom:5px;" for="option-value-6142">cardstock layers(-$0.50)</label>
<br>
<input style="display:none;" type="checkbox" name="option[656][]" value="6149" id="option-value-6149">
<label class="spancheckbox" style="float:left; margin-bottom:5px;" for="option-value-6149">belly band(-$0.25)</label>
<br>
<input style="display:none;" type="checkbox" name="option[656][]" value="6150" id="option-value-6150">
<label class="spancheckbox" style="float:left; margin-bottom:5px;" for="option-value-6150">ribbon(-$0.50)</label>
<br>
<input style="display:none;" type="checkbox" name="option[656][]" value="6151" id="option-value-6151">
<label class="spancheckbox" style="float:left; margin-bottom:5px;" for="option-value-6151">pocketfold name tag(-$0.15)</label>
<br>
<input style="display:none;" type="checkbox" name="option[656][]" value="6152" id="option-value-6152">
<label class="spancheckbox on" style="float:left; margin-bottom:5px;" for="option-value-6152">envelope liner(-$0.25)</label>
<br>
<input style="display:none;" type="checkbox" name="option[656][]" value="6153" id="option-value-6153">
<label class="spancheckbox on" style="float:left; margin-bottom:5px;" for="option-value-6153">address wrap(-$0.50)</label>
<br>
</div>
</div></div>
</body>
</html>
|
Спасибо большое! сча буду разбираться что там изменилось в JS от того что было:thanks:
|
| Часовой пояс GMT +3, время: 00:51. |