web-dev-qa-db-fra.com

Comment définir l'image src à l'aide de jQuery

J'essaie de changer l'attribut src de l'image à l'aide de jQuery

jQuery("#imageID").attr('src','http://localhost:8080/images/1/myImage.png' );

en utilisant le code ci-dessus, je peux changer l'attribut src, mais quand j'essaye ceci: -

jQuery("#imageID").attr('src',jQuery("#imageBlock").css('background-image') );

je ne peux pas changer le src.

à condition de

alert ( jQuery("#imageBlock").css('background-image') );

résultats:

url ( http: // localhost: 8080/images/1/myImage.png )

Edit # 1 Juste au moment où j'allais accepter la solution. Je dois dire que presque toutes les solutions ont fonctionné en FF. J'ai essayé:

  • tranche (4, -1);
  • split ("(") [1]> puis remplacez (")", "");

Je suppose que d'autres fonctionneront également. Mais aucune des solutions ne fonctionne dans IE. La raison étant: tandis que FF revient:

url ( http: // localhost: 8080/images/1/myImage.png )

Retours IE:

url (" http: // localhost: 8080/images/1/myImage.png ")

^^ faites attention aux citations ici

Maintenant, quelle pourrait être la façon générique de définir l'attr src. Dois-je tester le navigateur s'il est IE ou non?

Ceci est le code de travail.

var src = "";
    if ( jQuery.browser.msie ) {
        src = jQuery("#imageBlock").css('background-image').slice(5,-2);        
    }else{
        src = jQuery("#imageBlock").css('background-image').slice(4,-1);
    }   
    jQuery("#imageID").attr('src', src );

Je n'aime vraiment pas ça: x. S'il existe une autre solution que celle-ci, merci de me le faire savoir, sinon j'accepterai immédiatement la solution slice.

javascriptjqueryimagesrc
43
Rakesh Juyal

IMO, slice est plus approprié que substring ou replace. Essaye ça:

jQuery("#imageID").attr(
    'src',
    jQuery("#imageBlock").css('background-image').slice(4,-1)
);

Ici, vous coupez la chaîne entre url( et ). Voir MDC sur tranche pour une description détaillée de la méthode.

35
Andy E

Vous devez extraire la partie URL:

var backgroundImage = $("#imageBlock")
    .css('backgroundImage')
    .replace(/"/g,"")
    .replace(/url\(|\)$/ig, "");
jQuery("#imageID").attr('src', backgroundImage);
7
Darin Dimitrov

C'est parce que la chaîne url () est enroulée autour d'elle. Vous devrez le supprimer de la chaîne, par exemple en utilisant la fonction de remplacement ...

var bgimg = jQuery("#imageBlock").css('background-image').replace('url(', '');
bgimg.replace(')', '');
2
davydepauw

Vous devez retirer les parties url( Et fermer ) Pour que cela fonctionne.

Donc url(http://localhost:8080/images/1/myImage.png)

devient

http://localhost:8080/images/1/myImage.png

Vous pouvez le faire avec une sous-chaîne, un remplacement d'expression régulière ou toute méthode de votre choix.

http://www.w3schools.com/jsref/jsref_replace.asp

Peut-être:

jQuery("#imageID").attr('src',jQuery("#imageBlock").css('background-image').replace('url(','').replace(')','') )

0
Alex Sexton