jQuery将对象添加到动态父项

jQuery新手，在动态更改选择器时遇到问题。jQuery将对象添加到动态父项

<html> 
    <head> 
    <script type="text/javascript" src="jquery.js"></script> 
    <script> 
     function addFirst(){ 
     var fc = document.getElementById("fc").value; 
     $("#parent").append("<div id='firstChild" + fc + "'>My boring text.</div><a href='#' onClick='addSecond(\"firstChild" + fc +"\")'>Add Second Child</a>"); 
     fc = (fc - 1) + 2; 
     document.getElementById("fc").value = fc; 
    } 

    function addSecond(){ 
     $(***THE PARENT SELECTOR***).append("<div>Some more boring text.</div>"); 
    } 
    </script> 


    <body> 
    <input type="hidden" id="fc" value="1" 
    <div id="parent"></div> 
    <a href="#" onClick=" addFirst('#parent');">Add First Child</a> 
    </body> 
</html>

我需要一个选择是让我一个对象的直接父时父对象已动态创建的，通过我的文字“父SELECTOR”所示。

编辑

我解决这个，如果任何人遇到了这个问题，是使用.CALL onClick事件中。

位于所述addfirst仅（）函数的字符串：

<a href='#' onClick='addSecond.call(this,\"firstChild" + fc +"\"); return false;'>

然后，改变了addSecond（）函数：

$(this.parentNode).prepend("<div>BlahBlah");

来源

2012-02-29 Plummer

你尝试'$（本）。经（）'而不是append（）？ – Aprillion 2012-02-29 18:54:20

我实际上使用了.prepend（）。他们都基本上做同样的事情，只是你想要去的地方。我把激活链接放到了我希望内容去的div中，以避免任何父母/孩子的混淆。其作出的最差的部分是： '<' 的'.call'设定的参数在功能选择器'addSecond（）'为I指定的任何对象。然后，在函数中： '$（this.parentNode）.prepend（

BlahBlah

）;' – Plummer 2012-03-01 15:07:05

它不应该如何创建对象，选择器将工作相同。

$(this).parent().append("<div>Some more boring text.</div>");

如上所述，除非您传递对象的引用，否则这将不起作用。你可以更充分利用jQuery和这一切都将变得更为简单。

<html> 
    <head> 
    <script type="text/javascript" src="jquery.js"></script> 
    <script> 
     $(function() { 
     $("body").on('click', '.addsecond', function() { 
      $(this).parent().append("<div>Some more boring text.</div>"); 
     }); 

     $("body").on('click', '.addfirst', function() { 
      var fc = $('.fc').length + 1; 
      $("#parent").append("<div id='firstChild" + fc + "' class='fc'>My boring text.</div><a href='#' class='addsecond'>Add Second Child</a>"); 
     }); 
     }); 
    </script> 
    </head> 

    <body> 
    <div id="parent"> 
     <a href="#" onClick=" class="addfirst">Add First Child</a> 
    </div> 
    </body> 
</html>

注意，我添加了一个类addfirst和addsecond。这些用于自动添加处理程序到链接（或更准确地说，将处理程序附加到主体，当点击具有这些类的div时触发）。当它们被点击时，this被传递给该函数，允许你找到该对象的父项等等。

你可以更进一步清理这段代码，但是我猜不出你是怎么使用它的。我猜你想让孩子们加入与他们实际结局不同的地方。

例子：http://jsfiddle.net/2LjYH/

如果我猜，我会做#parent包裹 “添加第一个孩子” 的链接，就像这样：

<input type="hidden" id="fc" value="1" 
<div id="parent"> 
    <a href="#" onClick=" class="addfirst">Add First Child</a> 
</div>

例子：http://jsfiddle.net/XjUzA/

这似乎更直观地工作。如果你想要第二个孩子的链接后直接加入，你不想.parent().append()可言，你只是想用.after()：

例子：http://jsfiddle.net/XjUzA/1/

来源

2012-02-29 17:13:13

'addSecond（）'函数中的'this'不是对被单击的元素的引用。 – 2012-02-29 17:18:28

onClick参数是否更改？ – Plummer 2012-02-29 17:24:48

@am_not_i_am：我知道......这就是为什么我正在研究答案的第二部分。 – 2012-02-29 17:29:42

假设this关键字指目标元素你可以选择父母使用

$(this).parent();

来源

2012-02-29 17:12:29 detaylor

'addSecond（）'函数中的'this'不是对被单击的元素的引用。 – 2012-02-29 17:18:10

因此， function addSecond（）{（this）.parent（）。append（

Blahblahblah

）; } 坏评论中没有代码样本。 – Plummer 2012-02-29 17:22:44

@Tim：在评论中反编译代码。（'〜'键上的那个） – 2012-02-29 18:08:33

jQuery将对象添加到动态父项

回答

相关问题