Javascript，如何将值放在类的div中而不是id中

Question

我正在制作一个html表单，上面有步骤，最后一页是摘要。这工作得很好，但是现在我想基于div类而不是div id来显示值，这是因为我想要多次显示值。这是javascript：

 <SCRIPT TYPE="text/javascript">
 <!-- 
 function copyText(e)
 {    
  document.getElementById( e.name + 'preview' ).innerHTML = e.value;
 }
 //-->
 </SCRIPT> 


<script>
$("text1preview").draggable({ containment: '#dragcontainer' });
$("address1preview").draggable({ containment: '#dragcontainer' });
$("titlepreview").draggable({ containment: '#dragcontainer' });
$("zipcodepreview").draggable({ containment: '#dragcontainer' });
$("descriptionpreview").draggable({ containment: '#dragcontainer' });
$("wijkpreview").draggable({ containment: '#dragcontainer' });
$("address2preview").draggable({ containment: '#dragcontainer' });
$("tagspreview").draggable({ containment: '#dragcontainer' });
$(".catidpreview").draggable({ containment: '#dragcontainer' });
$("pricepreview").draggable({ containment: '#dragcontainer' });
</script>

这是摘要html：

  <tr>
    <td width="220">Samenvatting</td>
    </tr>
<tr>
    <td>Categorie:</td>
    <td><div class="categoryid"></div></td>
    </tr>
  <tr>
    <td>Titel van uw object:</td>
    <td><div id="titlepreview"></div></td>
   </tr>
 <tr>
    <td>Adres:</td>
    <td><div id="address1preview">  </div> </td>
    </tr>
    <tr>
    <td>Postcode</td>
    <td><div id="zipcodepreview"></div></td>
    </tr>
    <tr>
    <td>Plaats:</td>
    <td><div id="address2preview"></div></td>
    </tr>
  <tr>
    <td>Wijk:</td>
    <td><div id="wijkpreview"></div></td>
    </tr>
  <tr>
    <td>Omschrijving:</td>
    <td><div id="descriptionpreview"></div></td>
  </tr>
  <tr>
    <td>Tags:</td>
    <td><div id="tagspreview"></div></td>
  </tr>
  <tr>
    <td>Prijs per periode:</td>
    <td><div id="pricepreview"></div></td>
  </tr>
</table>

Answer 1

你需要这样的东西

 function copyText(e)
 {
    var matchingElements = document.getElementsByClassName( e.name + 'preview' ),
        matchCount = matchingElements.length,
        value = (e.nodeName === 'SELECT') ? e.options[e.selectedIndex].text : e.value;

    for (var i =0; i< matchCount; i++){
       matchingElements[i].innerHTML = value;
    }
 }

有关IE兼容性的信息，请参阅javascript document.getElementsByClassName compatibility with IE