-1

私はこれに大きな問題を抱えています。

jQueryで何かを書き込もうとしています。テキストをダブルクリックすると、その要素が非表示になり、選択ドロップダウンが表示されます...ただし、ユーザーがその要素を離れると、ドロップダウンは元のテキストに戻るはずです。

私は非常に多くの方法を試しましたが、どれもうまくいきません。ホバーなどでdblclickを使ってみました。

簡単にまとめると、ユーザーはテキスト付きのdivをクリックします。Divが非表示になっている選択が表示されます。ユーザーのマウスが領域を離れ、ドロップダウンが非表示になり、divが再び表示されます。

助けてくれてありがとう、私はこれで何時間も遊んでいます！

4

1 に答える 1

4

このようなものはあなたにとってうまくいきませんか？

HTML:

​<div>
    <span>TEXT TEXT TEXT</span>
    <select>
        <option>1</option>
        <option>2</option>
    </select>
</div>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

CSS:

span {
    cursor: default;
}

select {
    display: none;
}​

JS:

$('div').dblclick(function() {
    $('span').hide();
    $('select').show();
}).mouseleave(function() {
    $('span').show();
    $('select').hide();
});​

代替 JS:

$('div').dblclick(function() {
    $('span').hide();
    $('select').show();
});
$('select').mouseleave(function() {
    $('span').show();
    $('select').hide();
});​

最初の JS は、div の境界の外に移動すると、選択ボックスを非表示にします (これは、非表示になったスパン テキストのサイズによって設定されます)。2 つ目は、マウスを中に入れてからマウスを外すと、選択ボックスが消えます。必要に応じて、.mouseleave() から .change() に変更すると、誰かが実際に何かを選択したときにのみ選択ボックスが非表示になります。

JSFiddle

于 2012-12-06T19:39:57.380 に答える