Javascript-форум - Чекбокс мне в якорь.

Javascript-форум (https://javascript.ru/forum/)

- Общие вопросы Javascript (https://javascript.ru/forum/misc/)

- - Чекбокс мне в якорь. (https://javascript.ru/forum/misc/46456-chekboks-mne-v-yakor.html)

Чекбокс мне в якорь.

Доброго дня имеем простейшую конструкцию:

<a href="#">
	<input type="checkbox" name=""> test
</a>

$("a").on("click", function(event){

	$(this).children("input").attr("checked", true)
	return false

})

Очень бы хотелось поменять значение у чекбокса кликая на чекбокс.
К сожалению структуру HTML поменять нет возможности.

Цитата:

Сообщение от Scrum

4
return false

убрать

Цитата:

Сообщение от Scrum

Очень бы хотелось поменять значение у чекбокса кликая на чекбокс

$(this).children("input").prop("checked", true);

Цитата:

Сообщение от dmitriymar (Сообщение 307141)

убрать

Будет скачек.

Цитата:

Сообщение от nerv_ (Сообщение 307145)

$(this).children("input").prop("checked", true);

Не прокатило ) нужно кликать именно на чекбоксе.

Цитата:

Сообщение от Scrum

Очень бы хотелось поменять значение у чекбокса кликая на чекбокс.

Цитата:

Сообщение от Scrum

Будет скачек.

а вы точно уверены, что сами понимаете чего хотите? такого термина как скачёк нет

1 как бы чек бокс сам при клике будет менять своё значение - это поведение предопределённое
2 return false - вы убиваете поведение предопределённое

Scrum,
во блин ))) хоть по ссылке хоть по чекбоксу

<!DOCTYPE HTML>
<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script>
   $(function ()
{
   $("a").on("click", function(event){
   if(this != event.target) return;
   event.preventDefault();
   var input = $(this).children("input");
   input.prop("checked", !input[0].checked);
})

})
  </script>
</head>

<body>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br>

<a href="#">
    <input type="checkbox" name=""> test
</a>
</body>
</html>

Цитата:

Сообщение от dmitriymar (Сообщение 307156)

Употребляя термин "скачок" - я подразумеваю предопределенные действия для элемента A. в данном случае попытку перейти на закладка внутри страницы, но т.к. в случае имени закладки я использую заглушку в виде # то по моим соображениям браузер пытается найти закладку и не найдя ее сдвигает/скроллит/перемещает страницу к началу в следствие чего я отменяю его предопределенное действие (return false).

Совершенно ясно понимаю поставленную перед собой задачу.
Я хочу что бы при клике именно на чекбокс у меня не было предопределенного действия для элемента А и осуществилось предопределенное действие для чекбокса, но по странным (хотя вроде бы и понятным и логичным) обстоятельствам в event.target попадает элемент input для которого так же отрабатывает отмена предопределенного действия.

рони
Увы происходит "Скачёк". в firefox, opera, в chrome b ie10 - отрабатывает корректно.
Из приятного понравилась конструкция с проверкой )

Scrum,
как отменить всплытие для в firefox пока загадка )))

Scrum,
Вариант ... для firefox и прочих ... :write:

<!DOCTYPE HTML>
<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
  <script>
$(function () {
     $("a").on("click", function (event) {
         var input = $("input:checkbox", this),
             checked = !input.prop("checked");
         $(event.target).is(":checkbox") && (checked = !checked);
         window.setTimeout(function () {
             input.prop("checked", checked)
         }, 0);
         return false
     })
 });
  </script>
</head>

<body>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br>

<a href="#">
    <input type="checkbox" name=""> test
</a>
</body>
</html>

рони,
Громадное спасибо, отличное решение, немного напрягает таймоут, но это терпимо.

Цитата:

Сообщение от Scrum

К сожалению структуру HTML поменять нет возможности.

Это очень плохо. Так как такая структура строго запрещена стандартом.
Нельзя вкладывать "активный" элемент в другой "активный" элемент.
Советую кстати тщательней тестировать такую херню в разных браузерах.