Question

当您将鼠标悬停在任何超链接（具有'.link'类时，我想将div类（'。link-cloner'）附加到超链接类（'。link'））。
然后当您单击附加的（.link-cloner）类时，我想克隆它附加到的超链接，并将该链接附加到#container。

我快到了，我不能让最后一部分工作。

Codepen： http://codepen.io/StrengthandFreedom/pen/JXEEQP/

我尝试使用find（），nearest（）＆amp; $（this）有各种组合，但我不能让它只是克隆超链接（而不是linkCloner）并将其附加到#container。

jQuery的：

$(document).ready(function(e) {
  /* ------------------------
    Part 1 — WORKS
  --------------------------*/
  // Store link-cloner div in variable
  var linkCloner = $('<div class="link-cloner">Cloner</div>');

  // When mouse hover over any hyperlink
  $('.link').on('mouseover', function() {

    // Append the link-cloner class to the hyperlink
    $(this).append(linkCloner);
  }).mouseleave(function() {

    //on mouse leave, remove link-cloner 
    $(linkCloner).remove();
  });
/* ------------------------
    Part 2 — DOESN'T WORK
  --------------------------*/
  //Then when you click on the appended linkCloner, 
  clone the hyperlink and append it to the #container
  $(linkCloner).on('click', function() {

  // This code is wrong.... 
  event.preventDefault();
  $('.link').clone().append('<li></li>').appendTo('#container');

  });
});

有人能引导我朝着正确的方向前进吗？ JavaScript或jQuery，对我来说都很好（我正在学习）： - ）

Answer 1

你犯了一个小错误。用以下代码替换您的PART 2：

$('.link').on('click', function(event) {

  // This code is wrong.... 
  event.preventDefault();
  $(this).clone().append('<li></li>').appendTo('#container');

});

Answer 2

尝试使用

$().drag();

用于链接到div的克隆检查jquery文档

希望帮助

将Div类附加到超链接类 - 然后克隆＆amp;单击时将超链接附加到容器

2 个答案: