Livequery和each()

Question

我有一个.each()循环在所有匹配的元素上做一些事情。但我也有一种方法来添加这些元素...我正在尝试让livequery意识到已经添加了一个新元素，并通过相同的each循环运行它。

下面是一个通用的设置：http://jsfiddle.net/CUURF/1/

基本上，我如何将livequery和每个一起使用？

最终，我可以在metaboxes中动态添加tinymce编辑器文本框，但我相当确定的问题是，我的in不会在add/clone中自动递增，因为新元素不在DOM for each循环中。

编辑-我认为最重要的事情是我需要一个索引计数器，它是.each的标准配置才能与livequery一起工作？

编辑-这是wpalchemy中用于循环/克隆的代码

/* <![CDATA[ */
        jQuery(function($)
        {
            $(document).click(function(e)
            {       
                var elem = $(e.target);

                if (elem.attr('class') && elem.filter('[class*=dodelete]').length)
                {
                    e.preventDefault();

                    var p = elem.parents('.postbox'); /*wp*/

                    var the_name = elem.attr('class').match(/dodelete-([a-zA-Z0-9_-]*)/i);

                    the_name = (the_name && the_name[1]) ? the_name[1] : null ;

                    /* todo: expose and allow editing of this message */
                    if (confirm('This action can not be undone, are you sure?'))
                    {
                        if (the_name)
                        {
                            $('.wpa_group-'+ the_name, p).not('.tocopy').remove();
                        }
                        else
                        {
                            elem.parents('.wpa_group').remove();
                        }

                        the_name = elem.parents('.wpa_group').attr('class').match(/wpa_group-([a-zA-Z0-9_-]*)/i)[1];

                        checkLoopLimit(the_name);

                        $.wpalchemy.trigger('wpa_delete');
                    }
                }
            });

            $('[class*=docopy-]').click(function(e)
            {
                e.preventDefault();

                var p = $(this).parents('.postbox'); /*wp*/

                var the_name = $(this).attr('class').match(/docopy-([a-zA-Z0-9_-]*)/i)[1];

                var the_group = $('.wpa_group-'+ the_name +':first.tocopy', p);

                var the_clone = the_group.clone().removeClass('tocopy');

                var the_props = ['name', 'id', 'for'];

                the_group.find('input, textarea, select, button, label').each(function(i,elem)
                {
                    for (var j = 0; j < the_props.length; j++)
                    {
                        var the_prop = $(elem).attr(the_props[j]);

                        if (the_prop)
                        {
                            var the_match = the_prop.match(/\[(\d+)\]/i);

                            if (the_match)
                            {
                                the_prop = the_prop.replace(the_match[0],'['+(+the_match[1]+1)+']');

                                $(elem).attr(the_props[j], the_prop);
                            }
                        }
                    }
                });

                if ($(this).hasClass('ontop'))
                {
                    $('.wpa_group-'+ the_name +':first', p).before(the_clone);
                }
                else
                {
                    the_group.before(the_clone);
                }

                checkLoopLimit(the_name);

                $.wpalchemy.trigger('wpa_copy', [the_clone]);
            });

            function checkLoopLimit(name)
            {
                var elem = $('.docopy-' + name);

                var the_match = $('.wpa_loop-' + name).attr('class').match(/wpa_loop_limit-([0-9]*)/i);

                if (the_match)
                {
                    var the_limit = the_match[1];

                    if ($('.wpa_group-' + name).not('.wpa_group.tocopy').length >= the_limit)
                    {
                        elem.hide();
                    }
                    else
                    {
                        elem.show();
                    }
                }
            }

            /* do an initial limit check, show or hide buttons */
            $('[class*=docopy-]').each(function()
            {
                var the_name = $(this).attr('class').match(/docopy-([a-zA-Z0-9_-]*)/i)[1];

                checkLoopLimit(the_name);
            });
        });
        /* ]]> */
        </script> 

和我的metabox内部的标记：

<div id="testimonials"> 

    <h2>Testimonials</h2> 

    <a style="float:right; margin:0 10px;" href="#" class="dodelete-testimonials button"><span class="icon delete"></span>Remove All</a> 


        <div id="wpa_loop-testimonials" class="wpa_loop wpa_loop-testimonials"><div class="wpa_group wpa_group-testimonials first">   



        <a href="#" class="dodelete button"><span class="icon delete"></span>Remove</a> 

      <div class="slide_preview"> 
                <div class="preview_wrap"> 
        <img class="preview" src="" alt="preview" /> 
        </div> 
        <input type="hidden" name="_sidebar_meta[testimonials][0][testimonial_image]" value="" class="img_src" /> 


                <input type="hidden" name="_sidebar_meta[testimonials][0][slide_image_alt]" value="" class="img_alt" /> 


        <button class="upload_image_button button" type="button"><span class="icon upload"></span>Change Photo</button> 

      </div> 

      <div class="slide_text"> 

        <label>About Testimonial</label> 
        <div class="customEditor minimal"> 
                <textarea rows="5" cols="50" name="_sidebar_meta[testimonials][0][testimonial_desc]">I realized it was ME causing all the problems</textarea> 
        </div> 
      </div> 


    </div>      <div class="wpa_group wpa_group-testimonials last tocopy">    

    <h3 class="slide">Testimonial Name:     
            <input type="text" name="_sidebar_meta[testimonials][1][testimonial_name]" value=""  /> 
    </h3> 

        <a href="#" class="dodelete button"><span class="icon delete"></span>Remove</a> 

      <div class="slide_preview"> 
                <div class="preview_wrap"> 
        <img class="preview" src="http://localhost/multi/wp-content/themes/callingintheone/functions/WPAlchemy/images/default_preview.png" alt="_sidebar_meta[testimonials][1][testimonial_image] Preview" /> 
        </div> 
        <input type="hidden" name="_sidebar_meta[testimonials][1][testimonial_image]" value="" class="img_src" /> 


                <input type="hidden" name="_sidebar_meta[testimonials][1][slide_image_alt]" value="" class="img_alt" /> 


        <button class="upload_image_button button" type="button"><span class="icon upload"></span>Upload Photo</button> 

      </div> 

      <div class="slide_text"> 

        <label>About Testimonial</label> 
        <div class="customEditor minimal"> 
                <textarea rows="5" cols="50" name="_sidebar_meta[testimonials][1][testimonial_desc]"></textarea> 
        </div> 
      </div> 


    </div></div>     
    <p style="margin-bottom:15px; padding-top:5px;"><a href="#" class="docopy-testimonials button"><span class="icon add"></span>Add Testimonial</a></p>    

</div>

.tocopy类通过炼金术代码转换为一个新的隐藏元素(通过CSS)和最后一个元素

Answer 1

你的问题是每一个都不是用悬壁来执行的。在那之后，没有任何东西可以让它运行。

fixed code

Answer 2

答案：

备注：

• Does不使用livequery。没有必要在数组中现有编辑器的instance.
• Keeps跟踪中使用livequery。这比每次你想要一个编辑器时循环遍历DOM要快。DOM很慢，数组很快。这也让你可以轻松地访问任何或所有的编辑器，当你创建一个新的编辑器时，你可能会do.
• Doesn't循环。它只需修改新的编辑器，使其具有最后一个1加1的id。这是一个巨大的性能提升。