Hola dandreta
Hace un tiempo tuve que hacer algo con una funcionalidad parecida, lo modifique para que lo que queres, no tiene formato ni colores pero cumple con lo que pedis
Estas son las dos funciones:
Código:
function agrega(carga,valor)
/* Realizado por valeguz*/
/*agrega un item en la tabla*/
{
tabla = document.getElementById(carga).tBodies[0];
nro=tabla.childNodes.length;
row = document.createElement("TR");
cell = document.createElement("TD");
cell1 = document.createElement("TD");
textNode2 = document.createTextNode(parseInt(nro,10));
cell.appendChild(textNode2);
textNode1 = document.createTextNode(valor.value);
cell1.appendChild(textNode1);
row.appendChild(cell);
row.appendChild(cell1);
tabla.appendChild(row);
}
function deshacer(carga)
/* Realizado por valeguz*/
/*Borra el ultimo item de la tabla*/
{
tabla = document.getElementById(carga).tBodies[0];
nro=tabla.childNodes.length;
nro--;
var Cols = tabla.getElementsByTagName("TR");
if (Cols.length>1)
Cols[nro].parentNode.removeChild(Cols[nro]);
}
y el select, tabla y boton serian asi:
Código:
<body>
<SELECT id="desplegable" onChange="agrega('carga',this)">
<OPTION VALUE="casa">casa</OPTION>
<OPTION VALUE="auto">auto</OPTION>
</SELECT>
<br>
<table id="carga">
<tr>
<td><b>OPCION SELECCIONADA</b></td>
</tr>
</table>
<br>
<input type="button" value="Deshacer" onClick="deshacer('carga')">
</body>
Si lo que queres es un boton que te inserte en lugar del onChange.
Agrega el boton:
Código:
<input type="button" value="acepta" onClick="agrega('carga',desplegable)">
y borra el evento onChange del select
Espero que te sirva
Saludos
