Дублирующий div select вообще убираю, он не нужен
|
qwe88,
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>demo</title>
<style type="text/css">
b{
display: block;
}
</style>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script>
$(function () {
var divs = $("div.select");
divs.on("click", "input:checkbox", function (a) {
var b = a.delegateTarget;
var i = divs.index(b) ;
a = $("b.select").eq(i);
!a.data("old") && a.data("old", a.text());
b = $(":checked", b).parent().text() || a.data("old");
a.text(b)
});
})
</script>
</head>
<body>
<div class="select">
<div class="option">
<label><input type="checkbox" /> текст 1</label>
<label><input type="checkbox" /> текст 2</label>
<label><input type="checkbox" /> текст 3</label>
<label><input type="checkbox" /> текст 4</label>
</div>
</div>
<div class="select">
<div class="option">
<label><input type="checkbox" /> текст 1</label>
<label><input type="checkbox" /> текст 2</label>
<label><input type="checkbox" /> текст 3</label>
<label><input type="checkbox" /> текст 4</label>
</div>
</div>
<b class="select">Выбор1</b>
<b class="select">Выбор2</b>
</body>
</html>
|
СУПЕР!!
Спасибо вам огромное!! Я уже голову всю порвал. А не подскажите, еще вопрос: Тут другой скрипт работает: http://jsfiddle.net/vfn4b26L/ А у меня нет. Даже когда вставляю только этот код и ничего больше <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>Документ без названия</title>
</head>
<body>
<script type="text/javascript">
link.onclick = function(){
chbx.checked = chbx.checked ? false : true;
};
</script>
<a href="#" id="link">
<img src="http://img.okino.ua/emoji/img/smile.png" alt=""/>
</a>
<input type="checkbox" id="chbx">
</body>
</html>
|
qwe88,
ещё нет элемента а вы ему клик назначаите перенесите скрипт после ссылки поставьте или изучите https://learn.javascript.ru/onload-ondomcontentloaded |
Цитата:
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>demo</title>
<style type="text/css">
b{
display: block;
}
</style>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script>
$(function () {
var div = $("div.select"), chec = $("input:checkbox", div), b = $("b.select");
b.data("old", b.text())
div.on("click", chec, function (a) {
var text = chec.filter(':checked').parent().text() || b.data("old");
b.text(text)
});
})
</script>
</head>
<body>
<div class="select">
<div class="option">
<label><input type="checkbox" /> текст 1</label>
<label><input type="checkbox" /> текст 2</label>
<label><input type="checkbox" /> текст 3</label>
<label><input type="checkbox" /> текст 4</label>
</div>
</div>
<b class="select">Выбор</b>
</body>
</html>
|
Ок, спасибо огромное!
|
Подскажите еще, пожалуйста:
При нажатии на ссылку галочка в чекбоксе появляется, а слова в <b></b>нет. Появляются, если шлепну мышкой по самому чекбоксу. А мне нужно, что бы можно было и так и так |
qwe88,
:( |
| Часовой пояс GMT +3, время: 13:06. |