jQuery：添加html块到最近点击链接

我试图生成一个html代码块，当我点击一个链接。我在页面上有几次相同的链接“回复”。但我想在点击链接下生成代码。我尝试使用$（this），但它没有奏效。谢谢你的帮助！如果有更好的解决方案，请告诉我。另外作为参考，我试图创建一个答复textarea就像在YouTube上，当你点击回复链接时，它会打开一个textarea供用户输入文本。jQuery：添加html块到最近点击链接

的示例代码可以在这里Sample Code

来源

2012-02-21 Vish

你有库在您的提琴代码设置为mootools的。另外，这看起来不对。 $（“。grid_11 underVideo”），因为underVideo是一个类。 – Gregg 2012-02-21 21:43:46

即使在jsFiddle上设置了'jQuery'，你的代码也不能工作。但我认为'最接近（）'是你正在寻找的东西。另外为什么'

'。 – elclanrs 2012-02-21 21:46:31

我注意到你试图使用'“.grid_11 underVideo”'作为选择器。该选择器正在寻找一个带'underVideo'标签的'.grid11'类作为孩子。我认为你之后的选择器将是'“.grid_11.underVideo”' – 2012-02-21 21:54:45

Demo

$(".reply").one('click', function (event) { 
    var html = "<div class='alpha grid_11 underVideo'><ul><li><textarea class='roundedCorners textAreaLabel' rows='4' cols='100' wrap='off' placeholder='Respond to this video...' name='CommentTextArea'></textarea></li></ul></div>"; 
    $(this).parent().after(html); 
    return false; 
});

由于在目标元素上有一个类.reply，我用它代替了.normalText a:last-child。

使用.one代替绑定单击元素。使用.one只会触发一次，这将防止添加多个textareas。

$(this)是指点击的元素，在这种情况下是a.reply元素。使用.parent()将向上移动DOM并选择是span的父项。当然，.after(html)在span之后插入html。

return false;同时做两.preventDefault();.stopPropagation();

来源

2012-02-21 21:53:15 shaunsantacruz

谢谢羊驼！这工作！并感谢您解释您如何解决问题的方法！我有另一个问题？我可以添加功能到新生成的textarea吗？ – Vish 2012-02-22 15:39:50

尝试一下本作的JS：

$(".normalText a:last-child").bind('click', function (event) { 
     event.preventDefault(); 
     event.stopPropagation(); 
    $(this).parent().before("<div class='alpha grid_11 underVideo'><ul><li><textarea class='roundedCorners textAreaLabel' rows='4' cols='100' wrap='off' placeholder='Respond to this video...' name='CommentTextArea'></textarea></li></ul></div>");  
    });

$(this)将返回当前元素，.parent()将上一级DOM拉升，所以你可以追加你的HTML （在.before的情况下，它前面加上）

来源

2012-02-21 21:45:35 JKirchartz

有没有反正我可以添加更多的功能，生成的股利。我的意思是我想将焦点和模糊功能添加到所生成的新文本字段中。 – Vish 2012-02-22 15:31:34

感谢您的帮助！非常感谢您抽出时间回复我的查询。您的解决方案可行，但由@alpaca建议的解决方案更加精致。 – Vish 2012-02-22 15:41:59

这个怎么样？甚至可以考虑使用数据（），而不是在href，但它的工作原理：

http://jsfiddle.net/C3NNt/

来源

2012-02-21 21:54:33 Gregg

jQuery：添加html块到最近点击链接

回答

相关问题