Question

我正试图进入<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script> <!DOCTYPE html> <html> <head> <title></title> </head> <body> <form action="" id="req_form" method="POST"> <p>Your name: <input type="text" name="email_address" id="email_address" value="" /></p> <button type="button" name="submit" value="submit" onclick="Process_form();">Senden</button> </form> </body> </html> <script> function Process_form() { if($("#email_address").val()=='') { alert('Enter Email'); } else { var vali = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/; if (vali.test($("#email_address")) == false) { alert('Invalid Email Address'); } else { var r = confirm("Press a button!"); if (r == true) { $( "#req_form" ).submit(); } } } } </script>标签下的public void RefreshMapList(){ if (MapList == 0) { MapFragment fragment = (MapFragment) getFragmentManager().findFragmentById(R.id.simpleFrameLayout); fragment.RefreshMap(); } else if (MapList == 1) { Gallery_Fragment fragment = (Gallery_Fragment) getFragmentManager().findFragmentById(R.id.simpleFrameLayout); fragment.RefreshList(); } else { MapFragment fragment = (MapFragment) getFragmentManager().findFragmentById(R.id.simpleFrameLayout); fragment.RefreshMap(); Gallery_Fragment fragment2 = (Gallery_Fragment) getFragmentManager().findFragmentById(R.id.simpleFrameLayout); fragment2.RefreshList(); } }标签，以用于以后的样式设计。我尝试使用<label>，这给了我<input>值。如何获得对单击复选框字段的标签的标签？这是我的代码：

.firstElementChild

null

Answer 1

似乎您完全不知道child elements和siblings是什么。

为儿童考虑以下内容：

<div id="parent">
  <div id="child">I'm the child of my parent.</div>
</div>

兄弟姐妹以下内容：

<div id="sibling1"></div>
<div id="sibling2">I'm the sibling of sibling1.</div>

在您的代码中，这些label是input元素的兄弟姐妹。

因此，在您的脚本中，将console.log(targetCb.firstElementChild);更改为console.log(targetCb.nextElementSibling);

var checkboxes = document.querySelectorAll("input[type='checkbox']");


for (var i = 0; i < checkboxes.length; i++) {
  console.log(checkboxes[i]);
  checkboxes[i].addEventListener('change', (e) => {

    var targetCb = e.target;

    console.log(targetCb.nextElementSibling);

  });
}

<ul>
  <li class="title mb-3">STYLISTIC SET</li>
  <li>
    <input type="checkbox" id="sSet1" name="sSet1" value="sSet1" />
    <label for="sSet1">Stylistic set 1</label>
  </li>
  <li>
    <input type="checkbox" id="sSet2" name="sSet2" value="sSet2" />
    <label for="sSet2">Stylistic set 2</label>
  </li>
  <li>
    <input type="checkbox" id="sSet3" name="sSet3" value="sSet3" />
    <label for="sSet3">Stylistic set 3</label>
  </li>
  <li>
    <input type="checkbox" id="sSet4" name="sSet4" value="sSet4" />
    <label for="sSet4">Stylistic set 4</label>
  </li>
</ul>

Answer 2

更改 var targetCb = e.target; 到var targetCb = e.target.nextElementSibling;

进入输入标签的子元素

2 个答案: