Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   как сделать чтобы когда убираю галочку с чекбокса то текст убралось:) ? (https://javascript.ru/forum/misc/35937-kak-sdelat-chtoby-kogda-ubirayu-galochku-s-chekboksa-tekst-ubralos.html)

sarik 27.02.2013 10:34
как сделать чтобы когда убираю галочку с чекбокса то текст убралось:) ?
 
Пачему когда я выбираю чекбокс то текст показываеться но когда обратно убираю галочку с чекбокса то текст не исчезаеть?
<link href="http://starlexx.com/Touareg/style.css" rel="stylesheet" type="text/css">


<script src="http://starlexx.com/Touareg/jquery.js"></script>




<script>
$(document).ready(function(){
  var checkbox = $("#tab-1");
  $("input",checkbox).change(function () {
       var text = $(this).next().html();
       $("#design123456").html(text);
  });
});
</script>





<div id="tab-1">
<input type="checkbox">1<div id=div1> 111111 </div><br>
<input type="checkbox">2<div id=div2> 222222 </div><br>
</div>

<div id="design123456"></div>


как сделать чтобы когда убираю галочку с чекбокса то текст убралось:) ?

danik.js 27.02.2013 10:48
Патамушта нужна заминить строчьку
$("#design123456").html(text);

на такую:
$("#design123456").empty().html(text);

sarik 27.02.2013 11:07
Заменил но все так и не работаеть:)

ksa 27.02.2013 11:10
Цитата:
Сообщение от sarik
как сделать чтобы когда убираю галочку с чекбокса то текст убралось ?
Я гляжу скоро таки дождемся от тебя нормального тестового примера! :D

Как вариант...

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<!--
<link rel="stylesheet" type="text/css" href="tmp.css" />
-->
<style type="text/css">
</style>
<script type="text/javascript">
$(document).ready(function(){
  var checkbox = $("#tab-1 input:checkbox").change(function () {
       var text = (this.checked)?$(this).next().html() : '';
       $("#design123456").html(text);
  });
});
</script>
</head>
<body>
<div id="tab-1">
<input type="checkbox">1<div id='div1'> 111111 </div><br />
<input type="checkbox">2<div id='div2'> 222222 </div><br />
</div>
<div id="design123456"></div>
</body>
</html>

Вот это и есть полный тестовый пример.

sarik 27.02.2013 11:26
Все работаеть. А можно сделать так чтобы когда выбираеться оба чекбоксы то показывалось тексти обоих чекбоксов а во время выбора одного текст другого чекбокса не исчезало?:)

ksa 27.02.2013 13:21
Цитата:
Сообщение от sarik
а во время выбора одного текст другого чекбокса не исчезало?
Тут не понял... :blink:
Что делать когда изначально:
- ничего не выбрано
- выбран только первый
- выбран только второй

Что делать если после двойного выбора:
- отключили только первый
- отключили только второй
- отключили оба

sarik 27.02.2013 13:30
Я имел виду то что когда выбираеться первый чекбокс то показываеться текст но когда выбираеться второй чекбокс то первый текст исезает а потом второй текст показываеться .а можно сделать так чтобы оба показывались?

ksa 27.02.2013 14:32
Цитата:
Сообщение от sarik
а можно сделать так чтобы оба показывались?
Т.е. показывать текст выбраных флажков?

ksa 27.02.2013 14:37
Как вариант...

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<!--
<link rel="stylesheet" type="text/css" href="tmp.css" />
-->
<style type="text/css">
</style>
<script type="text/javascript">
$(document).ready(function(){
  var checkbox = $("#tab-1 input:checkbox").change(function () {
       var text = (this.checked)?$(this).next().html() : '';
	   var id=$(this).next().attr('id');
       $("#design123456 ."+id).html(text);
  });
});
</script>
</head>
<body>
<div id="tab-1">
<input type="checkbox">1<div id='div1'> 111111 </div><br />
<input type="checkbox">2<div id='div2'> 222222 </div><br />
</div>
<div id="design123456">
	<span class='div1'></span>
	<span class='div2'></span>
</div>
</body>
</html>

sarik 27.02.2013 15:03
Все получилось......Всем большое спасибо:)


Часовой пояс GMT +3, время: 01:43.