JSFiddle - React, Tailwind, and code Playground

by borisjavier

HTML

<div class="form-group">
  <label for="telefono">Teléfono</label>
  <div class="input-group">
    <div class="input-group-prepend">
      <select class="custom-select" id="indicativoPais">
        <option value="+1">+1</option>
        <option value="+44">+44</option>
        <option value="+61">+61</option>
        <!-- Otras opciones de indicativos de países -->
      </select>
    </div>
    <input type="tel" class="form-control" id="telefono" placeholder="Ingrese su teléfono">
  </div>
</div>

JavaScript

// Obtener los elementos del formulario
const indicativoPais = document.getElementById("indicativoPais");
const telefono = document.getElementById("telefono");

// Obtener el valor seleccionado del indicativo de país
const indicativoPaisSeleccionado = indicativoPais.value;

// Obtener el valor del teléfono ingresado
const numeroTelefono = telefono.value;

// Construir el número de teléfono completo con el indicativo de país
const numeroCompleto = indicativoPaisSeleccionado + numeroTelefono;

// Imprimir el número completo en la consola
console.log("Número de teléfono completo:", numeroCompleto);