0

私はこれを無駄に修正しようとしてきました。

コンテナ div と製品 div があります。製品はドラッグ可能で、コンテナーはドロップ可能で並べ替え可能で、製品のみを受け入れます。製品は複数のリスト アイテムです。ドラッグ可能なイベントでヘルパー関数を使用してリスト項目を作成し、複数のリスト項目を追加してコンテナに送信しました。しかし、私が実際に望んでいるのは、すべてのリスト項目からテキストを収集し、すべてを 1 つのリスト項目にまとめることです。それ、どうやったら出来るの？

HTML コード - 製品

<div class="phrase product ui-draggable">
<ul>
        <li class="bit-box">Atlanta<a href="#"></a></li>
        <li class="bit-box">London<a href="#"></a></li>
        <li class="bit-box">Mumbai<a href="#"></a></li>
        <li class="bit-input"><input type="text" class="maininput" /></li>
</ul>

HTML コード - コンテナ

<div id="container" style="border: 2px solid red; height: 400px;" class="ui-droppable ui-sortable ui-state-highlight">
<li class="containerproduct">Rio</li>
<li class="containerproduct">Santiago</li>
<li class="containerproduct">Atlanta London Mumbai</li>

最後のアイテムは、対応する製品がコンテナにドラッグされたときにコンテナが持つべきものです。

Jクエリ

    $(".product").draggable({
    helper: function (e,ui) {
        return $("<li class=\"containerproduct\">asd</li>").append($(this).find('.bit-box').clone().removeClass());
    },
    axis: 'y',
    revert : true
    });

現在、すべてリスト項目として保存されています。つまり、すべて別の行に保存されています。

4

1 に答える 1

0

を使用してこの問題を解決しました

  • リスト項目の複製に使用した first() と、
  • each() は、ビット ボックス リスト項目を反復処理してテキストを取得するために使用しました。

少し追加して、私たちは家から解放されました:)

            $(".product").draggable({
                distance: 10,
                cursor: "move",
                helper: function (e, ui) {
                    var newListItem = $(this).find('.bit-box').first().clone().removeClass().addClass("ui-state-default");
                    var fullCommand = "";
                    $(this).find('.bit-box').each(function( index ) {
                        fullCommand += $(this).text() + " ";
                    });

                    newListItem.text(fullCommand);
                    return (newListItem);
                },
                revert : true
                });
于 2013-01-16T10:37:30.313 に答える