Estoy intentando utilizar la función replaceWith de JQuery sobre un span con un texto. El texto lo reemplazo por un input de tipo text y un botón, todo ello usando el evento click sobre el span.
Una vez reemplazado, hasta ahí todo correcto.
El problema viene cuando le enlazo al evento click del botón una función para volver a reemplazar el contenido del input por un span como al principio pero con el contenido del input, pero el botón no hace nada.
He leído algo de que no es posible vincular a ese botón un evento para que actúe, pero aunque uso la función on.('nombreevento', function(){... no me hace nada.
¿alguien sabe a qué podría deberse?
Os dejo mi código:
Código:
<div class="span12" id="titulo">
<div id="miTitulo"><span>Título editable</span></div>
</div>
Código:
<script>
$(document).ready(function(){
$("div#miTitulo").on("click",function(){
var textoTituloEditable = $(this).text();
$(this).replaceWith("<input type='text' value='"+ textoTituloEditable +"'/><span id='boton' class='btn btn-info'>Ok</span>");
});
$("span#boton").on("click",function(){
var nuevoTexto = $("div#titulo").find(":text").val();
$("div#miTitulo").html("<span>"+nuevoTexto+"</span>");
});
});
</script>
