jQuery $("img[src=the_image_souce]").attr('src','new_src'); 不起作用

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/3956157/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-26 16:24:47  来源:igfitidea点击:

jQuery $("img[src=the_image_souce]").attr('src','new_src'); does not work

jqueryjquery-selectors

提问by shaheer

My code does not work I don't know why the_image_source and new_src are just place holders I have put real values in them

我的代码不起作用 我不知道为什么 the_image_source 和 new_src 只是占位符我已经在其中放入了实际值

I have also tried $("img[src=the_image_souce]")[0].attr('src','new_src');but it does not work either, please help

我也试过了$("img[src=the_image_souce]")[0].attr('src','new_src');,还是不行,求帮忙

回答by John Hartsock

You must be aware by accessing the [0] element in the jQuery Object this will return the DOM element. You cannot use the jQuery attr() method directly on a DOM element. It must be run on a jQuery Object

您必须注意,通过访问 jQuery 对象中的 [0] 元素,这将返回 DOM 元素。您不能直接在 DOM 元素上使用 jQuery attr() 方法。它必须在 jQuery 对象上运行

Essentially, if you will have more than one element that matches the following selector and you want to access the first matched element $("img[src='http://domain.com/image.jpg]")then you should use .first()or .eq(). Example

从本质上讲,如果你有以下选择匹配多个元素,你要访问的第一个匹配元素$("img[src='http://domain.com/image.jpg]"),那么你应该使用。首先().EQ() 。例子

$("img[src='http://domain.com/image.jpg']").first().attr('src','http://domain.com/newimage.jpg')

or

或者

$("img[src='http://domain.com/image.jpg']").eq(0).attr('src','http://domain.com/newimage.jpg')

or

或者

$($("img[src='http://domain.com/image.jpg']")[0]).attr('src','http://domain.com/newimage.jpg');

but this just looks strange

但这看起来很奇怪

回答by Walden Leverich

Ok, what browser and jQuery versions? Also, what's not working, the selector, setting the attribute, or leading the new image? Start simple, what does alert($("img[src=imgsrc])] show you? Also what does firebugs say is in the DOM after that code runs?

好的,什么浏览器和 jQuery 版本?另外,什么不起作用,选择器、设置属性或引导新图像?从简单开始, alert($("img[src=imgsrc])] 向你展示了什么?在代码运行后,firebugs 说 DOM 中是什么?

回答by Walden Leverich

Not for nothing but attribute selector isn't properly written. The "is important. Therefor you need:

不是没有,而是属性选择器没有正确编写。该"是很重要的。因此你需要:

$('img[src="the_image_source"]')

回答by Dr.Molle

If you use a relative path as image-src, it depends on the browser, what he will retrieve as src. Most Browsers will return the absolute path, not the relative path, so your match fails.

如果您使用相对路径作为 image-src,这取决于浏览器,他将检索什么作为 src。大多数浏览器将返回绝对路径,而不是相对路径,因此您的匹配失败。

You can only compare the end of the src:

您只能比较 src 的结尾:

$("img[src$='the_image_source']").attr('src','new_src');

But if you have more images with the same filename in different directories, this may force unexpected results. The best way I think is to use always absolute path inclusive protocol & domain as img-src and in jQuery-selectors.

但是如果您在不同目录中有更多具有相同文件名的图像,这可能会导致意外结果。我认为最好的方法是始终使用绝对路径包含协议和域作为 img-src 和 jQuery 选择器。

回答by Chris Conway

I'd do what WaldenL suggests and break it down piece by piece to find out what exactly is not working. First check your selector.

我会按照 WaldenL 的建议进行操作,并将其逐个分解以找出究竟是什么不起作用。首先检查您的选择器。

alert($("img[src=the_image_source]").length);

if that is greater than zero, then your selector is good. if not, then try using the id of the tag (if you know it) or some other way of getting that image tag.

如果它大于零,那么你的选择器是好的。如果没有,请尝试使用标签的 id(如果您知道)或其他获取该图像标签的方式。

if the selector is good, then there's something wrong with setting the src attribute. Make sure the value of new_src is valid and that you're not doing something silly like putting quotes around your variable or misspellings like this:

如果选择器是好的,那么设置 src 属性就有问题。确保 new_src 的值是有效的,并且你没有做一些愚蠢的事情,比如在变量周围加上引号或像这样的拼写错误:

var the_image_source = "http://mysite/images/img01.gif";
var new_src = "http://mysite/images/img02.gif";
$('img[src=the_image_souce]').attr('src','new_src'); // won't work - first variable is missing the "r" and not formatted correctly and attr setter has parenthesis
$('img[src=' + the_image_source + ']').attr('src',new_src); // should work

Also, make sure you have it inside the document ready function.

另外,请确保您在文档准备功能中拥有它。

$(document).ready(function() {
    var the_image_source = "http://mysite/images/img01.gif";
    var new_src = "http://mysite/images/img02.gif";
    $('img[src=' + the_image_source + ']').attr('src',new_src);
});