Question

我正在尝试自定义插件以满足我的需求。我要做的是当我从图像集合中单击图像时，我得到图像的src并使用该图像恢复插件。我遇到的问题是当我得到图像的来源时，它给了我[对象对象]而不是实际的源。我使用$（this）.attr（“src”）来获取图像源。

所以基本上我的代码看起来像这样：

    <div id="images">
      <img src="image1"/>
      <img src="image2"/>
      <img src="image3"/>
      <img src="image4"/>
    </div>

$(document).ready(function(){
  $("#images img").on("click", function(){
    var img_src=$(this).attr("src");
    $("#id").plugin({
      image:img_src
    });
});
});

编辑：我更新了我的代码，以便更清楚我在问什么。

更新：实际上，即使我从中删除了所有其他j，代码也不起作用。但它适用于jsfiddle

更新2：所以我在互联网上寻找解决方案，似乎我正在使用的插件以某种方式覆盖了attr功能。有没有办法阻止它这样做？或者也许创建一个不受插件影响的jQuery实例？

Answer 1

尝试通过输出到控制台来探索该对象的内容。

使用Firebug for Firefox或Chrome集成开发人员控制台与F12。

打开控制台，修改代码：

var img_src=$(this).attr("src");
console.log(img_src);
$("#id").plugin({
  image:img_src
});

检查输出。

$("img").attr("src")应该是字符串。

Answer 2

这实际上是一个CSS选择器问题！

它不起作用，因为#images img无法按预期工作！应img#images引用标识为img的{{1}}。

所以，如果您有这样的HTML：

images

您应该使用：

<img id="img1" class="useImg" src="http://fc01.deviantart.net/fs71/f/2013/032/8/3/papa_happy_by_ovilia1024-d5tfw0h.png" width="30px" height="30px" />
<img id="img2" class="useImg" src="http://fc01.deviantart.net/fs70/f/2013/032/a/b/papa_horrified_by_ovilia1024-d5tfwdt.png" width="30px" height="30px" />

在此处运行演示：http://jsfiddle.net/aM4xw/2/

Answer 3

attr返回对象而不是源值的原因是我使用的插件覆盖了attr函数。我修改它以将src作为字符串而不是对象返回。删除它也解决了问题，但插件需要自定义插件。感谢所有试图帮助我的人，我真的很感激。

attr的值显示对象对象

3 个答案: