Question

我有这个代码 -

http://codepen.io/sturobson/pen/3f1cd0077301489290d9e5a6e40077b7

当你选择一个图像时，写一些文字，然后点击'预览'一个灯箱，图像和文字进入视野。

我的问题是，如果用户然后关闭灯箱并选择不同的图像，则两个图像都会出现。我不想在关闭灯箱时删除文本/图像（这是最简单的选择）。

另外我注意到，如果你点击几次选择按钮就会'打破'并给出一个带有选择单词的蓝色背景。不知道如何解决这个问题。

任何帮助都会非常感激。

提前致谢。

编辑，添加代码（对于不开始这样做而道歉）......

将类添加到所选图像的代码，这为“select”一词提供了蓝色背景，并将图像克隆到另一个div中

  $('.selectable-image').on("click", function() {
    $('.selectable-image.selected').removeClass('selected');
    $(this).addClass('selected');
        $(".previewimage img").remove();
        $(".selected > img").first().clone().appendTo(".preview-image");

    return false;
  });

此代码根据单击

更改单词以进行选择或选择

  $('.selectable-image').on("click", function() {
    $('.select-photo', this).text(function(_, oldText) {
        return oldText === 'SELECTED' ? 'SELECT' : 'SELECTED';
    }).parent().siblings().find('.select-photo').text(function(){
        return $(this).data('text');
    })
    return false;
  });

如果我单击两次相同的元素，我需要弄清楚如何更改删除'selected'类。此外，如果我单击一个然后单击另一个图像，删除第一个图像并将其替换为新选择，我想交换附加的图像。

我希望在周日早上有意义。

Answer 1

您正在使用appendTo()，这很可能会将图片附加到灯箱而不是更新它。尝试使用attr("src")更新源代码而不是添加新源。

用jquery切换所选图像

1 个答案: