0

我在 jquery 工作。我编写了一个脚本,将图像从第一个 div 添加到第二个 div。但是,我不希望两次添加相同的图像。

这是第一个 div 的代码

<div><span class="span1">
<img width="30" hieght="30" name="productimage" src="http://panther:805/Computers.jpg"></span>
<span class="span1">Black_xxl_Slim</span>
<span class="span1">1</span>
<a class="pull-right" href="#"><i onclick="Add(this)" class="icon-plus"></i></a>
</div>

这是第二个 div 的代码:

<div class="span6" id="separat">
            <ul class="thumbnails pre-scrollable" id="productbundles">
            </ul>
        </div>

这是我的jQuery

function Add(obj) {
    var img = $(obj).closest('div').find('img').first();

    var image_src = $(img).attr('src');
    var newobj = $('<li class="span2" id="bunle' + id++ + '"><a href="javascript: void(0)"><img hieght=30  width=30 src="' + image_src + '" /></a><h5>'+"Name:" + name + '</h5><span id="pric' + id + '"><b>'+ "Price:"+ price + '</b></span>');
    $('#productbundles').append(newobj);
}

添加 div 效果很好,但它允许将相同的项目添加两次。我怎样才能阻止这种情况发生?在此先感谢您的帮助。

4

3 回答 3

0

您必须有一个已经存在或已添加的图像列表,以避免再次添加它们。只需建立一个列表,如:

var added_images = [];

并使用简单的方法检查列表中的图像存在:

    if (added_images.indexOf(src)) {
    // image already exists
    } else {
       // add the image to the list
       added_images.push(src);
       // and DOM...
    }
于 2013-01-09T11:25:47.817 回答
0
if(!$("#productbundles img[src$='" + image_src + "'").length)
{
var newobj = $('<li class="span2" id="bunle' + id++ + '"><a href="javascript: void(0)"><img hieght=30  width=30 src="' + image_src + '" /></a><h5>'+"Name:" + name + '</h5><span id="pric' + id + '"><b>'+ "Price:"+ price + '</b></span>');
$('#productbundles').append(newobj);
}

如果您有 src 的完整路径,请尝试删除 $.

于 2013-01-09T11:29:04.803 回答
0

有很多方法可以做到这一点......您可以向<img>已附加的类添加一个类并检查该类..使用hasClass

我这样做的方式是..创建一个数组..并将其推src入数组并检查数组中src是否存在

function Add(obj) {
  var addedImagesArray=[];
  var img = $(obj).closest('div').find('img').first();

   var image_src = $(img).attr('src');
   var newobj = $('<li class="span2" id="bunle' + id++ + '"><a href="javascript: void(0)"><img hieght=30  width=30 src="' + image_src + '" /></a><h5>'+"Name:" + name + '</h5><span id="pric' + id + '"><b>'+ "Price:"+ price + '</b></span>');
   if (addedImagesArray.indexOf(image_src)) {
       alert("Image Already Added");//src present in the array so do nothing or show an alert..
   } else{
       $('#productbundles').append(newobj); //append the image
       addedImagesArray.push(image_src); ///add src to array
   }
}
于 2013-01-09T11:30:05.990 回答