0
votes

Afficher une seule image lors de l'affichage de l'image avec JavaScript

J'utilise ce code pour afficher un aperçu d'une URL d'image. XXX

Cela fonctionne bien, mais si je change l'URL de l'image, la deuxième image apparaîtra également et le premier restera. Comment puis-je le faire pour que l'une seule aperçu de l'image soit affichée? https://jsfiddle.net/lucytech/qohxryl4/4/ < p> aussi pourquoi ne fonctionne-t-il pas avec des images, par exemple https://ae01.alicdn.com/kf/htb1q0ucsyrpk1rjszteq6awavxap/mifa-portable-Buetooth-Sputeur-Portable-Wiress-Loudspeaker-sound-system-10w-stereo-Music-Sour Étanche-extérieur-haut-parleur.jpg Quel est le problème avec cette URL? Dans le navigateur, il affiche une image alors pourquoi le code donne-t-il une erreur?

javascript jquery

1 commentaires

Cochez cette case jsfiddle.net/q9yzj1ok

4 Réponses :

0
votes

Utiliser APPEND () Ajoutez toujours un nouvel élément. Peut-être devriez-vous inclure la balise IMG dans le HTML initial avec sa propre propriété ID et modifier sa propriété SRC avec ATTR (). Vous pouvez utiliser le spectacle () et masquer () sur un élément d'image ou vous pouvez envelopper dans un div / span et cacher celui-ci.

0 commentaires

0
votes

avant d'ajouter le

ci-dessous le code doit fonctionner. p> xxx pré>

Après cela ajoutez votre étiquette IMG p>

jQuery('#prev').html('<img class="previewImage" style="max-width:500px;" src="' + src + '">');

0 commentaires

1
votes

Veuillez utiliser ce JavaScript. Cela vous donnera des résultats comme selon vos attentes.

$('#input_2_19').blur(function() {
    console.log(jQuery(this).val());

    var src = jQuery(this).val();

    var previews = $(".previewImage");
    var drawPreview = true;

    var PreviousSource = $(this).data('previousSource');

    if(src.match("/\.(jpeg|jpg|gif|png)$/") != null && src != "")
    {
         $("#warning").html("Must be an image");
          return false;  
    } else {
        $("#warning").html("");
        $('#prev').html('<img class="previewImage" style="max-width:50px;" src="' + src + '">');   
    }
});

0 commentaires

0
votes

Le problème de l'image ne prévisualisant pas les liens que je pense est lié à l'expression régulière que vous avez écrite dans le str.math code> Je ne suis pas très bon pour que je ne puisse pas vous aider avec Mais j'ai pris un coup d'œil au premier commentaire de votre message "Jinesh", son expression régulière semble fonctionner. Pour l'autre problème, j'ai écrit une pièce de code pour obtenir des commentaires pour résoudre l'image multiple

p>



<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div id="warning"></div>

<input id="urlInput">
<div id="prev">
  <img id="prevImg">
</div>

0 commentaires