JavaScript onchange事件不会更改div内容

Question

I want to replace the content of my <div id="score_here">10</div> , when I select a value from my drop-down <select id="ansRate" onchange="javascript:add_score(this);"> . I have setup my JavaScript function which is shown below, but it doesn't work. What is the problem with this?

<div>
<select id="ansRate" onchange="javascript:add_score(this);">
<option value="0">Answer Rate</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
</select>
</div>

<div id="score_here" style="width:100px;height:100px;background-color:yellow;">
 81
</div>

<script type="text/javascript">

function add_score(a){
   var string = $("#questionScore").text();
   var thenum = string.replace( /^\D+/g, ''); 
   var add = $(a).val(); 
   var total = parseInt(thenum) + parseInt(add);
   document.getElementByID('score_here').innerHTML = total;
 }

 </script>

Answer 1

document.getElementById("id") 

不

document.getElementByID("id")

Answer 2

should be:

document.getElementById('score_here').innerHTML = total;

:-)

Answer 3

Try this:

document.getElementByID is not the correct syntax, instead try document.getElementById

You can done everything by jQuery.

Just replace this line:

document.getElementByID('score_here').innerHTML = total;

to

$('#score_here').html(total);