0

ドラッグ アンド ドロップ インターフェイスを介して jQuery を使用して HTML ジェネレーターを開発しています。現在、ユーザーは「ブロック」要素を iFrame をオーバーレイする非表示の div にドラッグします (iframe にドロップしているように見えます)。要素がこの非表示の div にドロップされると、対応する HTML が iFrame 本体に追加されます。

次に、ユーザーが iFrame 内の要素を選択し、選択した要素のプロパティを変更できるようにしたいと考えています。

CSS インポートと jQuery/jQueryUI スクリプトを iFrame ヘッドに追加しました。

私が直面している問題は、追加された iFrame 要素をクリックすると、マウスが iFrame を離れたときにのみ jQuery 選択投げ縄が表示され、iframe の外側に表示されることです。

私が iFrame を使用している理由は、コードがユーザーのために「生成」されたときに、iFrame 本体のコンテンツをダイアログ ボックスに追加するだけだからです。

以前に iFrame と jQuery で問題に直面した人はいますか? このプロセスで私を助けることができるドキュメント/JavaScript ライブラリはありますか?

ありがとう！

ロリー

4

1 に答える 1

0

この問題の「修正」は複雑ですが、私の状況では機能します。

次のように、iframe に追加された各要素に対してクリック イベントを作成しました。

$('iframe').contents().find('.elem'+blockVal).on('click', function(){
    $('iframe').contents().find('.selected').removeClass('selected');
    $(this).addClass('selected');
//alert('you have selected the block with class element'+ blockVal);
});

blockVal は、html を iframe に追加する関数から渡される変数です。上記の関数は、iframe に追加された各要素にクリック リスナーを追加するだけです。要素のいずれかがクリックされると、「選択済み」のクラスが与えられ、そのクラスを既に持っている他の要素はそれを失います。

それが意味をなさない場合は申し訳ありません。

似たようなことをしている人への私のアドバイス: iframe を使用しないでください。

于 2013-01-07T17:18:25.907 に答える