Tengo unos input que recogen la información ingresada y construye la otra parte del link:
<div>
<h1>URL</h1>
<!-- Esto se modifica visualmente para que el usuario sepa a donde va a ir. -->
<h2>http://ejemplo.com/<span id="spanData1"></span>/<span id="spanData2"></span></h2>
<!-- Estos son los inputs de data. -->
<input type="text"id="data1">
<input type="text"id="data2">
<!-- Este botón hará la redirección -->
<button id="ir">Ir</button>
</div>
<script>
// Variables para la modificación de URL
var data1 = ''
var data2 = ''
// Al usar un tecla y levantarla
$('#data1').keyup(function(){
// Modificar la URL que se ve
$('#spanData1').text($('#data1').val())
// Guardar el dato en la variable correspondiente
data1 = $('#data1').val();
})
// Hace lo mismo que el anterior pero para el segundo
$('#data2').keyup(function(){
$('#spanData2').text($('#data2').val())
})
//Al hacer click en el boton ir
$('#ir').click(function(){
// Crear la URL para la redirección y...
var url = 'http://ejemplo.com/' + data1 + '/' + data2;
// Hacer la Redirección en una ventana nueva
window.open(url, '_blank');
})
</script>
Lo que sucede es que solo toma la información del primer input y no la del segundo, por lo tanto cuando doy click en 'ir' me lleva a un link a medio construir, qué hago?