web-dev-qa-db-ja.com

jQueryを使用して画像srcを設定する方法

JQueryを使用して画像のsrc属性を変更しようとしています

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

上記のコードを使用すると、src属性を変更できますが、これを試してみると：-

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

srcを変更できません。

提供された

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

戻り値：

url（ http：// localhost：8080/images/1/myImage.png ）

＃1を編集ソリューションを受け入れようとしていたとき。ほぼすべてのソリューションがFFで機能したと言わざるを得ません。私は試した：

  • slice（4、-1）;
  • split（ "（"）[1]>次にreplace（ "）"、 ""）;

他の人もうまくいくと思います。しかし、IEで機能するソリューションはありません。理由：FFが返す間：

url（ http：// localhost：8080/images/1/myImage.png ）

IEの戻り値：

url（ " http：// localhost：8080/images/1/myImage.png "）

^^ここで引用符を気に

さて、src属性を設定する一般的な方法は何でしょうか。ブラウザがIEであるかどうかをテストする必要がありますか？

これが作業コードです。

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 );

私はそれが本当に好きではありません：x。これ以外の解決策がある場合は、お知らせください。そうでなければ、sliceの解決策をすぐに受け入れます。

javascriptjqueryimagesrc
43
Rakesh Juyal

IMO、sliceはsubstringやreplaceよりも適切です。これを試して：

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

ここでは、url(と)の間の文字列をスライスしています。メソッドの詳細については、MDCの slice を参照してください。

35
Andy E

URL部分を抽出する必要があります。

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

これは、url（）文字列がその周りをラップしているためです。たとえば、replace関数を使用して、文字列から削除する必要があります...

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

それが機能するためには、_url(_を取り除き、_)_の部分を閉じる必要があります。

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

になる

_http://localhost:8080/images/1/myImage.png_

これは、部分文字列、正規表現の置換、または任意の方法で行うことができます。

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

おそらく：

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

0
Alex Sexton