0

親要素を閉じるためにクリックできる「x」画像の背景を持つ div があります。

ここに画像の説明を入力

その周りのコードは次のとおりです。

function remove_cell(el) {
   $(el).closest("div.cell").remove();
}

<div class="handle">
    <div class="grip"></div>
    <div class="closeX" onclick="remove_cell(this)"> </div>
</div>

しかし、「x」divをクリックすると、その周りにハンドルが付いた醜いフレームが表示されます。マウスボタンを離すと削除が機能しますが、マウスダウンでこのフレームを表示しているものと、それを取り除く方法を知っている人はいますか?

ありがとう

4

2 に答える 2

0

コードで、イベントの伝播を停止するか、false を返して、クリックがポップアップ ウィンドウの下の要素をクリックしないようにします。

function remove_cell(el) {
   $(el).closest("div.cell").remove();
   return false;
}

編集:実際には、インラインコードを使用しているため(最良のアイデアではありません)、インラインである必要があります:

<div class="closeX" onclick="remove_cell(this); return false"> </div>
于 2013-04-18T17:59:58.917 に答える
0

問題は、これが含まれていた大きな div (上のオレンジ色のボックス) に contenteditable=true が含まれていることであることが判明しました。どうやらその場合、ブラウザ（私はFFを使用していました）は、画像がクリックしたdiv（私のdiv.closeX）の背景であっても、画像要素をクリックするとこの選択フレームをスローします。サブ div (div.handle) に属性 contenteditable=false を与えることでそれを取り除きました。これにより、必要に応じてオレンジ色の div のコンテンツが編集可能のままになりました。

作品:

<div class="cell " contenteditable="true">
   <div class="handle" contenteditable="false">
    <div class="closeX" onclick="remove_cell(this)"> </div>
   </div>
</div>
于 2013-04-19T00:54:50.100 に答える