jQuery 在同一页面上克隆两种形式的输入?

发布于 2024-12-28 00:24:07 字数 952 浏览 2 评论 0原文

我一直在尝试让同一页面上的两个表单正常工作,我遇到的唯一问题是克隆输入无法正常工作,由于 div 元素,它们似乎相互冲突。

我一直使用本教程作为指导: http://www.9lessons.info/2009/06 /submit-multiple-forms-jquery-ajax.html

这是使用一种表单的代码: http://jsfiddle.net/yBdTA/

这就是我想要实现的目标: http://jsfiddle.net/c4Uce/

请注意,当您第一次单击第二个“添加更多”链接时输入克隆而不是第二个。

我知道我可以复制克隆的 jQuery 函数以匹配第二种形式:

   $(function(){
        var removeLink = ' <a class="remove" href="#" onclick="jQuery(this).parent().slideUp(function(){ jQuery(this).remove() }); return false">remove</a>';
        jQuery('a.add').relCopy({ append: removeLink});    
    });

但我希望这是动态的,我该如何称呼它?就像 9lessons 指南一样,我可以使用 PHP 为克隆元素创建唯一标识符,并希望 jQuery 匹配 ID,

希望我说清楚了。

帮助表示赞赏。

I have been trying to get two forms on the same page to work and the only issue i'm having is not getting the clone inputs to work, they seem to conflict with each other due to the div elements.

I have been using this tutorial as a guide:
http://www.9lessons.info/2009/06/submit-multiple-forms-jquery-ajax.html

Here is the code working with one form:
http://jsfiddle.net/yBdTA/

And this is what i want to achieve:
http://jsfiddle.net/c4Uce/

Notice when you click on the second 'Add More' link the first input clones rather than the second.

I know i could duplicate the jQuery function for the clone to match the second form:

   $(function(){
        var removeLink = ' <a class="remove" href="#" onclick="jQuery(this).parent().slideUp(function(){ jQuery(this).remove() }); return false">remove</a>';
        jQuery('a.add').relCopy({ append: removeLink});    
    });

but i want this to be, how can i call it, dynamic? like the 9lessons guide, i can use PHP to create unique identifiers for the clone elements and want the jQuery to match the ID's,

Hope i made this clear.

Help appreciated.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

芯好空 2025-01-04 00:24:07

你可以尝试一下,它适用于多种形式

http://jsfiddle.net/yBdTA/2/

(function($) {

    function remove(){
    $('.clone').each(function(i){
           var input= $(this);
            input.find('a.remove').click(function(){
              input.remove();
           });
         });
    }

    $('form').each(function(i){
          var form = $(this);
          var removeLink = '<a class="remove" href="#">remove</a>';
          var iputclone = form.find('p.clone').append(removeLink);

          form.find('a.add').click(function(){
              iputclone.clone().insertBefore(this);
              remove();
          });
        });


})(jQuery);

更新 :

iputclone.clone().insertBefore(this).find('.input').attr('value','');

//So easy, U can think a object when we start will is ifself, use it next, and next 

U can try it , it work to multi form

http://jsfiddle.net/yBdTA/2/

(function($) {

    function remove(){
    $('.clone').each(function(i){
           var input= $(this);
            input.find('a.remove').click(function(){
              input.remove();
           });
         });
    }

    $('form').each(function(i){
          var form = $(this);
          var removeLink = '<a class="remove" href="#">remove</a>';
          var iputclone = form.find('p.clone').append(removeLink);

          form.find('a.add').click(function(){
              iputclone.clone().insertBefore(this);
              remove();
          });
        });


})(jQuery);

Update :

iputclone.clone().insertBefore(this).find('.input').attr('value','');

//So easy, U can think a object when we start will is ifself, use it next, and next 
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文