0

我想要实现的是我想在 div 中附加所有内容,除了输入按钮。有没有办法我可以not在 Jquery 中使用一种方法?而且它只针对我的第一个 span 块。这是一个例子:

http://jsfiddle.net/HjFPR/64/

jQuery

(function(){
    $('.select_listing').on('click',function () {
       $('.saved_listing').append($(this).parent().find('span').html());
    });
})();​

HTML

<div class="boxes"> 
    <span> Matt </span>
    <span> 123 Fake Street </span>
    <input type="button" class="select_listing" value="add">
</div>

<div class="boxes"> 
    <span> James </span>
    <span> 123 Real Street </span>
    <input type="button" class="select_listing" value="add">
</div>

<div class="saved_listing"> </div>
​
4

6 回答 6

2

我认为这可以工作:

(function(){

    $('.select_listing').on('click',function () { 
        $('.saved_listing').append($(this).parents(".boxes").find('span'));
    });

})();​

让我知道。

编辑

在这里小提琴:http: //jsfiddle.net/9NBKN/

它似乎在移动元素,你想要吗?或者你想要复制元素?

编辑 2

更新小提琴以复制而不是移动元素: http: //jsfiddle.net/9NBKN/3/ (基本上我使用了“克隆”方法)。

于 2012-12-21T17:15:40.493 回答
2

这就是你想要的吗?

(function(){
    $('.select_listing').on('click',function () {
        // Create a copy of .boxes and append to .saved_listing
        var htmlContent = $(this).closest('.boxes').clone().appendTo('.saved_listing');
        // Remove input
        htmlContent.find('input').remove();
    });
})();
于 2012-12-21T17:19:59.270 回答
1

尝试这个:

http://jsfiddle.net/HjFPR/66/

(function() {

    $('.select_listing').on('click', function() {
        // Get the parent, and clone it!
        var pdiv = $(this).parents('.boxes').clone();

        // In the cloned parent, remove the button!
        pdiv.find("input.select_listing").remove();

        // Append to saved_listing the modified pdiv!
        pdiv.appendTo(".saved_listing");
    });

})();​
于 2012-12-21T17:19:17.680 回答
0

只需each()遍历所有兄弟姐妹。

http://jsfiddle.net/HjFPR/72/

(function(){

    $('.select_listing').on('click',function () {

        $(this).siblings().each(function() {            
            $('.saved_listing').append($(this).html());
        });

    });

})();​

编辑: 这样,您就不会不必要地向上遍历以向下遍历。

于 2012-12-21T17:32:50.093 回答
0

你的问题是这条线.find('span').html()

此语句仅获取在 上查询的第一个跨度的 html。在这种情况下你需要循环..

试试下面的方法..

(function() {

    $('.select_listing').on('click', function() {
        var $this = $(this);
        var $span = $this.closest('div.boxes').find('span');
        var html = '';
        $span.each(function() {
            html += $(this).html();
        });
        $('.saved_listing').append(html);
    });

})();​

检查小提琴

于 2012-12-21T17:20:50.843 回答
0

你可以试试这个:

$(".boxes").children().not("input[type='button']")

not() 函数将过滤掉选择器中的元素

于 2012-12-21T17:22:06.960 回答