How to change an image according to the url parameter

Asked

Viewed 164 times

-1

javascript jquery

  • Please describe your doubt better.

  • I have to show a banner in only one url, but what differentiates one url from another are parameters, because it is a search... I wanted to know if you have a script that has a condition that I can change the banner according to the parameter url.

  • Use this solution to capture the parameters of the URL with Jquery: (https://answall.com/questions/65696/howto capture parameters-pass_pela-url-usando-javascript) With the desired wall meter use Ajax to grab the image

  • Please read this post https://pt.meta.stackoverflow.com/questions/1078/como-e-por-que-aceitar-uma-resposta/1079#1079

1 answer

0

CSS

This CSS line to hide the div that contains the image, because Javascript will be used to show the contents of this div when desired.

.minhaDiv {
   display:none;
}

The Script

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

<script type="text/javascript">
    // Analise o parâmetro do URL
    function getParameterByName(name, url) {
        if (!url) url = window.location.href;
        name = name.replace(/[\[\]]/g, "\\$&");
        var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
            results = regex.exec(url);
        if (!results) return null;
        if (!results[2]) return '';
        return decodeURIComponent(results[2].replace(/\+/g, " "));
    }
    // obtem o parametro fq
    var dynamicContent = getParameterByName('fq');

     $(document).ready(function() {

        // Checa se o parametro é H:321
        if (dynamicContent == 'H:321') {
            $('#mostra').show();
        } 
    });
</script>

HTML

 <div id="mostra" class="minhaDiv">
    <img src="Sua_Imagem.ext">
 </div>

Examples:

?fq=H:321

?fq=H:150

Browser other questions tagged javascript jquery

You are not signed in. Login or sign up in order to post.