2

優れたfcbkcompletejqueryプラグインを使用してリストアイテムを操作するdivがあります。ただし、これをドラッグ可能で並べ替え可能なページに接続すると、移動すると余分な装飾がフリーズすることに気付きました。これにより、控えめに言っても、最終結果は洗練されていないように感じられます。ドラッグする前にmousedownイベントをインターセプトできることは知っていますが、スタイルをシンプルに保つためにどの要素を変更すればよいかわかりません。

これはfcbkcompleteのデモで、Facebookのメッセージ作成機能に似ています。jsfiddleで、divを下の並べ替え可能なリストにドラッグする準備ができたら、すべての派手な装飾（画像を閉じる、青いボックスに分割、「入力を開始...」ツールチップ、最後の空のテキストボックスをh1ヘッダーをクリックしても値を取得できるように、単純な文字列に置き換えられます。これを行う方法を知っている人はいますか？

                            $("#draggable").draggable({
                            connectToSortable: "#sortable",
                            helper: "clone",
                            revert: "invalid",
                            distance: 20
                        });

                        $('#draggable').each(function () {
                            $(this).mousedown(function () {

                                // Need to clear styles here
                                //$(this).parent().children('.maininput').hide('blind', 500);
                            });
                        });

見てくれてありがとう。JSFiddleはこちらです。そして、これが問題のスクリーンショットです。

4

1 に答える 1

2

同様の質問をしましたが、答えはこの問題も解決します。クローンの代わりにカスタム ヘルパーを使用する必要がありましたが、すべてうまくいきました。ドロップに関しては、

                $("#container").droppable({
                accept: '.product',
                drop: function (event, ui) {
                    var x = ui.helper.clone();
                    x.removeClass().attr('style', '');
                    x.addClass("ui-state-default");
                    x.appendTo('#container');
                    ui.helper.remove();
                }
            });

問題は、私が使用していなかったことです。

于 2013-01-16T10:35:22.627 に答える