使用 jquery 测试元素属性时收到错误答案

【问题标题】：Error received when testing for element attribute using jquery使用 jquery 测试元素属性时收到错误
【发布时间】：2012-07-29 22:38:28
【问题描述】：

我正在尝试测试动态 php 照片库中的属性，该照片库将图像从文件夹加载到库中。画廊使用灯箱显示单击后的照片。这是我用来测试的：

if( $('#lightboxImage').attr('src') !== 'undefined'){ do something here }

我认为在调试中出现初始错误（无法调用 null 的方法“attr”），因为当单击图库中的图像时，#lightboxImage 只有一个“src”属性。页面首次加载时没有明显点击任何内容。

关于如何解决这个问题的任何想法？

谢谢

【问题讨论】：

不，这里确实有问题。 $("#anything") 在任何情况下都不应返回 null，并且 attr() 应始终在任何 jQuery 对象上定义。看得更深。
你确定你已经包含了 jQuery 吗？
@Charlie Rudenstål：然后$ is not defined 会被抛出
如果你想要imgs 和空的src=""，你可以$('#lightboxImage[src]')。
@zerkms 你当然是对的。有趣的是，只要您没有在相关页面上覆盖 $，直接在 Chrome 控制台中输入 $ 就会返回 function () { [native code] }。它返回 null 并且似乎不包含任何特别的内容。

标签： jquery lightbox

【解决方案1】：

我支持@Malvolio，您的错误相当加起来。你不应该得到你描述的错误。也就是说：

<img id="src" class="src" src="http://goo.gl/UohAz"><br/>
<img class="src" src=""><br/>
<img class="src">

console.log($('#nothing').attr('src'));
console.log($('#src').attr('src'));

http://jsfiddle.net/7ZGwe/

运行onload 给了我：

undefined
http://goo.gl/UohAz

因此，正如 Malvolio 所建议的，您的实际问题与其他问题有关。我无法推测出任何比 Malvolio 更好的东西，除非应该尝试使用 jQuery() 代替 $()。

这与您的潜在问题有点不同，但与您的要求有关。您可以：

[src]:not([src=""])

http://jsfiddle.net/jSQ3P/3

在您的选择器中并绕过检查。换句话说：

$('#lightboxImage[src]:not([src=""])').doStuff();

【讨论】：

【解决方案2】：

为什么不将代码附加到需要引发此代码的元素的单击事件，以便仅在需要时调用它？

$(document).ready(function() {
    $("#clickable").click(function() {
        if( $('#lightboxImage').attr('src') !== 'undefined'){
            // do something here 
        }
    });

});

【讨论】：

$('#lightboxImage[src]') 将给出一个带有src 的元素，甚至是src=""。可能有用，但我不知道在这种情况下是否需要。
好吧，实际上[src]:not([src=""] 将解决空的src 问题。