Как мне получить родительский идентификатор в этой функции? - PullRequest
Новая
       2

Как мне получить родительский идентификатор в этой функции?

0 голосов
/ 23 марта 2019

Прикрепленный код правильно возвращает идентификатор и значение отмеченного флажка.Мне нужно получить идентификатор вложенного div, чтобы я мог установить атрибут отображения скрытым.

<!DOCTYPE html>

<html>
<head>
</head>
<body>
    <div id="wrapper">
        <form>
            <div id="boatdiv1"><input type="checkbox" name="cb" id="boat1" value="123" onclick='doClick();'><label for='boat1'>boat1</label><br></div>
            <div id="boatdiv2"><input type="checkbox" name="cb" id="boat2" value="456" onclick='doClick();' onclick='doClick();'><label for='boat2'>boat2</label><br></div>
            <div id="boatdiv3"><input type="checkbox" name="cb" id="boat3" value="789" onclick='doClick();'><label for='boat3'>boat3</label><br></div>
        </form>
    </div>


</body>
<script>
    function doClick() {
        var checkedValue = null; 
        var inputElements = document.getElementsByName('cb');
        for(var i=0; inputElements[i]; ++i){
              if(inputElements[i].checked){
                   checkedValue = inputElements[i].value;
                   checkedID = inputElements[i].id;
                   console.log('checked id = '+checkedID);
                   console.log('value = '+checkedValue);
                   break;
              }
        }
              ParentID = checkedID.offsetParent;
              console.log(ParentID.id);
    }
</script>
</html>

Я ожидал, что ParentID вернет идентификатор.Вместо этого я получаю сообщение об ошибке «TypeError: undefined не является объектом (вычисление« ParentID.id »)»

Ответы [ 2 ]

1 голос
/ 23 марта 2019

Вам необходимо удалить атрибуты onevent и использовать вместо этого свойство onevent или прослушиватель событий:

<input doClick () ...>

Это в основном то, что вам нужно, чтобы скрыть родительский элемент щелкаемого элемента (event.target): 

event.target.parentElement.style.display = 'none';

Демо

Подробности прокомментированы в демоверсии 

// Reference the form 
var form = document.forms[0];

// Register the form to the change event
form.onchange = hide;

/*
Called when a user unchecks/checks a checkbox
event.target is always the currently clicked/changed tag
Get the changed parent and set it at display: none
*/
function hide(e) {
  var changed = e.target;
  changed.parentElement.style.display = 'none';
  console.log(`Checkbox: ${changed.id}: ${changed.value}`);
  console.log(`Parent: ${changed.parentElement.id}`);
}
<!DOCTYPE html>
<html>

<head></head>

<body>
  <div id="wrapper">
    <form>
      <div id="boatdiv1"><input type="checkbox" name="cb" id="boat1" value="123"><label for='boat1'>boat1</label><br></div>
      <div id="boatdiv2"><input type="checkbox" name="cb" id="boat2" value="456"><label for='boat2'>boat2</label><br></div>
      <div id="boatdiv3"><input type="checkbox" name="cb" id="boat3" value="789"><label for='boat3'>boat3</label><br></div>
    </form>
  </div>
</body>

</html>
0 голосов
/ 23 марта 2019

Используйте parentNode - также обратите внимание, что checkedID является строкой, поэтому у нее нет родителя. Используйте getElementById, чтобы получить проверенный ввод: 

ParentID = document.getElementById(checkedID).parentNode;
console.log(ParentID.id);
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...