[英]How to set the image src using jQuery
I am trying to change the image src attribute using jQuery 我试图使用jQuery更改图像src属性
jQuery("#imageID").attr('src','http://localhost:8080/images/1/myImage.png' );
using the above code i can change the src attribute, but when i try this:- 使用上面的代码我可以更改src属性,但当我尝试这个: -
jQuery("#imageID").attr('src',jQuery("#imageBlock").css('background-image') );
i am unable to change the src. 我无法更改src。
provided 提供
alert ( jQuery("#imageBlock").css('background-image') );
returns: 收益:
url( http://localhost:8080/images/1/myImage.png )
url( http:// localhost:8080 / images / 1 / myImage.png )
Edit #1 Just when i was about to accept the solution. 编辑#1就在我即将接受解决方案时。 I must say, almost all solution worked in FF.
我必须说,几乎所有的解决方案都在FF中运行。 I tried:
我试过了:
I guess others will also work. 我猜其他人也会工作。 But none of the solutions is working in IE.
但是这些解决方案都没有在IE中运行。 Reason being: while FF returns:
原因是:当FF返回时:
url( http://localhost:8080/images/1/myImage.png )
url( http:// localhost:8080 / images / 1 / myImage.png )
IE Returns: IE返回:
url(" http://localhost:8080/images/1/myImage.png ")
url(“ http:// localhost:8080 / images / 1 / myImage.png ”)
^^ mind the quotes here ^^介意这里的报价
Now, what could be the generic way to set the src attr. 现在,可能是设置src attr的通用方法。 Do i need to test the browser if it is IE or not?
我是否需要测试浏览器是否为IE?
This is the working code. 这是工作代码。
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 );
I really don't like it :x. 我真的不喜欢它:x。 If there is another solution than this, then please let me know or else i will accept the
slice
solution straight away. 如果有另外一个解决方案,请告诉我,否则我会立即接受
slice
解决方案。
IMO, slice
is more appropriate than substring
or replace
. IMO,
slice
比substring
或replace
更合适。 Try this: 试试这个:
jQuery("#imageID").attr(
'src',
jQuery("#imageBlock").css('background-image').slice(4,-1)
);
Here, you're slicing the string in between url(
and )
. 在这里,你在
url(
和)
之间url(
字符串。 See MDC on slice for a detailed description of the method. 有关方法的详细说明,请参见切片上的MDC。
You need to extract the url part: 你需要提取网址部分:
var backgroundImage = $("#imageBlock")
.css('backgroundImage')
.replace(/"/g,"")
.replace(/url\(|\)$/ig, "");
jQuery("#imageID").attr('src', backgroundImage);
It's because the url() string is wrapped around it. 这是因为url()字符串缠绕在它周围。 You'll need to strip it from the string, for example using the replace function...
你需要从字符串中删除它,例如使用replace函数...
var bgimg = jQuery("#imageBlock").css('background-image').replace('url(', '');
bgimg.replace(')', '');
You would need to strip the url(
and closing )
parts out for that to work. 你需要剥离
url(
和关闭)
部分才能工作。
So url(http://localhost:8080/images/1/myImage.png)
所以
url(http://localhost:8080/images/1/myImage.png)
becomes 变
http://localhost:8080/images/1/myImage.png
You could do this with a substring, a regex replace or any method of your choosing. 您可以使用子字符串,正则表达式替换或您选择的任何方法来执行此操作。
http://www.w3schools.com/jsref/jsref_replace.asp http://www.w3schools.com/jsref/jsref_replace.asp
Perhaps: 也许:
jQuery("#imageID").attr('src',jQuery("#imageBlock").css('background-image').replace('url(','').replace(')','') )
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.