jQuery挂钩到附加元素上

查找我如何挂钩到最近添加的元素上有点麻烦。jQuery挂钩到附加元素上

想法是，添加一个元素两次，然后根据添加的元素设置不同的CSS属性。

while(i < str.length){ 
    chars = str[i]; 
    dupText = "<span>" + chars + "</span>"; 

    var fh = $hc.append(dupText); //need to hook onto these 2 elements 
    var sh = $hc.append(dupText); 

    var width = fh.width()/2; 

    //These two lines don't apply any changes to the appended elements. 
    $(sh[0]).width(width); 
    $(fh[0]).css('text-indent', -width); 

    i++; 
}

但是，这似乎没有做任何事情。分别钩住这两个元素以进行CSS更改的最佳方法是什么？

Javascript解决方案也是受欢迎的。

来源

2016-06-13 Adjit

什么你的意思 “钩到” 吗？什么具体不工作？ – David

@大胆修改元素的行不起作用。所以虽然'fh'和'sh'获得了合适的宽度，所以不会对元素进行更改。 – Adjit

试试'$（sh [0]）.style.width（width）; $（fh [0]）.css（'text-indent'，-width.toString（））;' – Roysh

缓存元素被追加为jQuery-element

var $hc = $('#parent'); 
 
var str = 'Rayon'; 
 
var i = 0; 
 
while (i < str.length) { 
 
    var chars = str[i]; 
 
    var dupText = "<span>" + chars + "</span>"; 
 
    var elem = $(dupText); 
 
    $hc.append(elem); 
 
    var width = elem.width()/2; 
 
    elem.width(width); 
 
    elem.css('text-indent', -width); 
 
    i++; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
 
<div id='parent'></div>

来源

2016-06-13 17:02:53 Rayon

您可以像这样使用clone。

while(i < str.length){ 
chars = str[i]; 
dupText1 = "<span>" + chars + "</span>"; 
// add css for dupText1 element 
dupText2 = $(dupText1).clone(); 
// add css for dupText2 element. 

var fh = $hc.append(dupText1); 
var sh = $hc.append(dupText2); 

i++;}

来源

2016-06-13 16:43:11 Neelesh

jQuery的append方法不返回附加项，它返回你附加的元素，这意味着你的sh和fh变量既是您$hc元素。相反，得到的$hc最后一个子每项任务：

fh = $hc.append(dupText).children().last(); 
sh = $hc.append(dupText).children().last(); 

width = fh.width()/2; 

sh.width(width); 
fh.css('text-indent', -width);

临提示：使用调试，测试你的假设。在这种情况下，您认为fh和sh变量包含对附加元素的引用。将这些变量输出到控制台，或者使用断点来观察它们的内容，都会显示出来。

来源

2016-06-13 16:48:14

谢谢！运行良好，但与其他答案一起，因为我认为缓存元素将是一种更可靠的方式，以确保我正在更改的元素与添加的元素相同。 – Adjit

jQuery挂钩到附加元素上

回答

相关问题