Gerador de Link

Programação
#1

Bom dia

eu queria fazer um botao que ao clicar nele é gerado um link a partir do que foi digitado no meu input, tem como?

#2

Tipo um encurtador de links?

#3

nao, na verdade preciso gerar um link mesmo porque no input ja vou esta inserindo a URL com encurtador

queria pegar esta url e adicionar em um <p> ou <a href> ja com a opção de clicar nele, entendeu?

#4

pode ser mostrado em um paragrafo desde que de para clicar nele, nao sei se fui claro :confused:

#6

carregamento.html (12,7,KB)

#7

Segue minha pagina a principio ela esta funcionando ok, porem quando eu salvo em PDF o link da rota so abre no computador em celulares nao abre, por isso que queria tentar fazer esta gambiarra :sweat_smile:

#8

tentei algo do tipo:

porem quando ele gera o link ele me retorna o localhost (127.0.0.1:5500/html/teste.html)

e eu precisava que me desse (https://is.gd/1h3KDM)
sabe o porque?

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

<script>

    function myFunction() {

        var valor = document.getElementById("flink").value;

        $.getJSON("https://is.gd/create.php?callback=?", {

            url: valor,

            format: "json"

        }).done(function (data) {

            let novolink = data.shorturl;

            console.log(novolink);

            if (novolink !== undefined)

                document.getElementById("h2resp").innerHTML = novolink;

            else document.getElementById("h2resp").innerHTML = "Erro ao gerar link";

        });

    }

</script>

<style>

    .cinput {

        font-size: 24px;

    }

</style>

<form id="myForm">

    <input class="cinput" type="text" name="flink" id="flink" placeholder="Insira o link original">

    <input class="cinput" type="button" onclick="myFunction()" value="Gerar Link">

</form>

<h2>Link Gerado</h2>



<a href="" id="h2resp"></a>
#9

Vou testar.

#10

fala mano, cara, vida ta corrida demais desculpe a demora, só consegui testar hj. Faz assim:

quando vc gerou seu link, vc atribuiu somente o “visual” dele, mudou apenas o texto, e esqueceu de passar o atributo de um link de fato: href.

Vai lá no trecho que vc tem isso:

document.getElementById("h2resp").innerHTML = novolink

E altera pra isso:

const elemLink = document.getElementById("h2resp");
elemLink.innerHTML = novolink;
elemLink.href = novolink;
//elemLink.target = "_blank" //opcional, vc pode usar isso pra abrir o link numa nova aba