Как напечатать переменную Javascript в таблице?

Question

В таблице, которую я делаю, у меня есть переменная Radio Button с именем «cost», и я хочу напечатать переменную «cost» в нижнем колонтитуле формы в предложении типа «Сделать выезд для <>»

Пожалуйста, можете ли кто-нибудь дать указания относительно того, как это сделать? Много много спасибо, ТЕХ

<table id="gradient-style" summary="Throttle Conversion"> 
    <thead> 
     <tr> 
      <th scope="col">Existing Throttle</th> 
      <th scope="col">Upgrade To</th> 
      <th scope="col">Additional Features</th> 
      <th scope="col"></th> 
      <th scope="col"></th> 
      <th scope="col">Upgrade Price</th> 
      <th scope="col">Select One</th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr> 
      <td></td> 
      <td></td> 
      <td><strong><center>29 Functions</td> 
      <td><strong><center>Simplex Radio</td> 
      <td><strong><center>Duplex Radio</td> 
      <td></td> 
      <td></td> 
     </tr> 
     <tr> 
      <td>DT400</td> 
      <td>DT402</td> 
      <td><center>*</td> 
      <td></td> 
      <td></td> 
      <td>$25.00</td> 
      <td><input type="radio" name="cost" value="25"></td> 
     </tr> 
     <tr> 
      <td>DT400</td> 
      <td>DT402R</td> 
      <td><center>*</td> 
      <td><center>*</td> 
      <td></td> 
      <td>$50.00</td> 
      <td><input type="radio" name="cost" value="50"></td> 
     </tr> 
     <tr> 
      <td>DT400</td> 
      <td>DT40D</td> 
      <td><center>*</td> 
      <td></td> 
      <td><center>*</td> 
      <td>$65.00</td> 
      <td><input type="radio" name="cost" value="65"></td> 
     </tr> 
     <tr> 
      <td>DT400R</td> 
      <td>DT402R</td> 
      <td><center>*</td> 
      <td><center>*</td> 
      <td></td> 
      <td>$25.00</td> 
      <td><input type="radio" name="cost" value="25"></td> 
     </tr> 
      <tr> 
      <td>DT400R</td> 
      <td>DT402D</td> 
      <td><center>*</td> 
      <td></td> 
      <td><center>*</td> 
      <td>$65.00</td> 
      <td><input type="radio" name="cost" value="65"></td> 
     </tr> 
    </tbody> 
    <tfoot> 
     <tr> 
     <td colspan="7"> Based on your selection, the conversion cost is <?php $_post["cost"]?>  </td> 
     </tr> 
    </tfoot> 
</table> 

Answer 1

Это сделать:

var table = document.getElementById('gradient-style'); 
var inputs = table.getElementsByTagName('input'); 
var radios = []; 
var span = document.getElementById('cost_marker'); 

for(var x = 0; x < inputs.length; x++) { 
    if(inputs[x].type == 'radio' && inputs[x].name == 'cost') { 
     inputs[x].onclick = function() { 
      span.innerHTML = '$' + parseFloat(this.value).toFixed(2); 
     } 
    } 
} 

Единственное изменение, которое нужно внести в разметке, чтобы добавить тег диапазона вокруг стоимости с идентификатором «cost_marker» так что Javascript знает, где обновить стоимость:

<tr> 
    <td colspan="7"> 
    Based on your selection, the conversion cost is 
    <span id='cost_marker'><?php $_post["cost"]?></span> 
    </td> 
</tr> 

And here's an example of it at work.