Question

我正在尝试根据是否已选中复选框来更改div中的文本。我是Javascript的新手，所以这就是我的尝试......如果有人能指出我已经离开的地方，我会很感激。

function SetContent() {
  if (document.complianceformAA.compliance_AA.checked == true) {
    document.getElementById('ComplianceSummary').innerHTML = "A compliance concern is found for Key Element I-A.";
  } else {
    document.getElementById('ComplianceSummary').innerHTML = "Key Element I-A is met.";
  }
}

<div id="Concerns">
  <form id="complianceformAA">
    <input type="checkbox" id="compliance_AA">
    <label for="compliance_AA">Compliance Concern?</label>
  </form>
</div>
<button onclick="SetContent ();">Generate Summary</button>
<div id="ComplianceSummary"></div>

Answer 1

您不应使用named elements，而是使用Document.getElementById()

选择id

＆＃13;

function SetContent() {
  if (document.getElementById('compliance_AA').checked) {
    document.getElementById('ComplianceSummary').innerHTML = "A compliance concern is found for Key Element I-A.";
  } else {
    document.getElementById('ComplianceSummary').innerHTML = "Key Element I-A is met.";
  }
}

＆＃13;

<div id="Concerns">
  <form id="complianceformAA">
    <input type="checkbox" id="compliance_AA">
    <label for="compliance_AA">Compliance Concern?</label>
  </form>
</div>
<button onclick="SetContent ();">Generate Summary</button>
<div id="ComplianceSummary"></div>

＆＃13;

Answer 2

首先，缩进代码：

public EmpAndAddress(int empId,String empName,EmpAddress eAddr){
    this.empId = empId;
    this.empName = empName;
    this.eAddr = (EmpAddress) eAddr.clone();    
}

其次，你没有得到这样的元素。你通过以下方法之一得到它：

getElementById('id')

这会根据ID获取元素。例如，这个：

function setContent() {
  if (document.complianceformAA.compliance_AA.checked == true) {
    document.getElementById('ComplianceSummary').innerHTML="A compliance concern is found for Key Element I-A.";
  } else {
   document.getElementById('ComplianceSummary').innerHTML="Key Element I-A is met.";
  }
}

会得到这个：

document.getElementById('checkbox');

getElementsByTagName();

这会使所有元素具有相同的标记。

<input type="checkbox" id="checkbox"></input>

可以返回

document.getElementsByTagName('button');

使用此HTML代码：

HTMLCollection [ <button>, <button>, <button>, <button> ]

getElementsByClassName()

这将返回具有特定类名的所有元素。例如：

<div id="buttons">
  <button>
  <button>
  <button>
  <button>
</div>

可以返回

document.getElementsByClassName('a')

使用此代码

HTMLCollection [ <button.a>, <button.a>, <button.a>, <button.a> ]

getElementsByName()

这将获取指定名称的所有元素。例如：

<div id="buttons">
  <button class="a">
  <button class="a">
  <button class="a">
  <button class="a">
</div>

可以返回

document.getElementsByName('hi');

使用此HTML代码：

NodeList [ <button.className> <button.className> ]

所以你想要的javascript是这样的：

<div id="buttons">
<button name="hi" class="className">
<button name="hi" class="className">
</div>

以下是一个例子：

function setContent() {
  checkBox = document.getElementById('compliance_AA');
  if (checkBox.checked) {
    document.getElementById('ComplianceSummary').innerHTML = "A compliance concern is found for Key Element I-A.";
  } else {
    document.getElementById('ComplianceSummary').innerHTML = "Key Element I-A is met.";
  }
}

    function setContent() {
      checkBox = document.getElementById('compliance_AA');
      if (checkBox.checked) {
        document.getElementById('ComplianceSummary').innerHTML = "A compliance concern is found for Key Element I-A.";
      } else {
        document.getElementById('ComplianceSummary').innerHTML = "Key Element I-A is met.";
      }
    }

使用innerHTML根据复选框更改div值

2 个答案: