js HTMLチェックボックス

Question

チェックボックスをオンにすると、一連のテキストを読み込むことができません。以下のJSとHTML ...簡単な修正を探る - しかし、私はこれが機能していないことが失われている。 trainerexp

#wrap div#trainerexp 
{ 
    padding:10px; 
    font-weight:bold; 
    background-color:#ff0; 
} 

Answer 1

ため

// JS

function getTrainerExp() 

{ 
    var trainerexp="None"; 
    //Get a reference to the form id="courseform" 
    var theForm = document.forms["courseform"]; 
    //Get a reference to the checkbox id="includeexp" 
    var includeexp = theForm.elements["includeexp"]; 

    //If they checked the box set trainerexp to ACMEEXP 
    if(includeExp.checked==true) 
    { 
     trainerexp="ACMEXP"; 
    } 
    //return the trainer expenses 
    return trainerexp; 
} 


function calculateExp() 
{ 
    var expense = getTrainerExp() ; 

    //display the result 
    var divobj = document.getElementById('trainerexp').checked; 

    divobj.style.display='block'; 
    divobj.innerHTML = "Please Include " +expense; 

} 

HTML

<div id="wrap"> 
<form action="" id="courseform" onsubmit="return false;"> 
<div> 
<p> 
<label for='includeexp' class="inlinelabel">If course delivery is at customer site include trainer travel costs and expenses</label> 

<input type="checkbox" id="includeexp" name='includeexp' onclick="calculateExp()" /> 
</p> 

<div id="trainerexp"></div> 

CSSエントリのdocument.getElementByIdを使用しない理由は？

function getTrainerExp() 
 

 
{ 
 
    var trainerexp="None"; 
 
    //Get a reference to the form id="courseform" 
 
    var theForm = document.forms["courseform"]; 
 
    //Get a reference to the checkbox id="includeexp" 
 
    var includeExp = document.getElementById('includeexp'); 
 

 
    //If they checked the box set trainerexp to ACMEEXP 
 
    if(includeExp.checked==true) 
 
    { 
 
     trainerexp="ACMEXP"; 
 
    } 
 
    //return the trainer expenses 
 
    return trainerexp; 
 
} 
 

 

 
function calculateExp() 
 
{ 
 
    var expense = getTrainerExp() ; 
 

 
    
 
    document.getElementById("trainerexp").innerHTML = "Please Include " +expense; 
 

 
}

#wrap div#trainerexp 
 
{ 
 
    padding:10px; 
 
    font-weight:bold; 
 
    background-color:#ff0; 
 
}

<div id="wrap"> 
 
<form action="" id="courseform" onsubmit="return false;"> 
 
<div> 
 
<p> 
 
<label for='includeexp' class="inlinelabel">If course delivery is at customer site include trainer travel costs and expenses</label> 
 

 
<input type="checkbox" id="includeexp" name='includeexp' onclick="calculateExp()" /> 
 
</p> 
 

 
<div id="trainerexp"></div>