1

関数がドロップダウンのコードがあります。ドロップダウンはスムーズに動作します。コメントをクリックすると、ボックスが永続的に表示され、外側のクリックで閉じます。

この場合、コメントをクリックするとボックスが表示され、マウスをドラッグしてコメントを入力すると閉じました。

では、どうすれば箱を保管できますか？

.dropdown {
position:relative;
}

.dropdown-menu {
position:absolute;
top:100%;
left:0;
z-index:1000;
display:none;
float:left;
min-width:300px;
list-style:none;
background-color:#fff;
border:1px solid rgba(0,0,0,0.2);
border-right-width:2px;
border-bottom-width:2px;
-webkit-border-radius:5px;
-moz-border-radius:5px;
border-radius:5px;
-webkit-box-shadow:0 5px 10px rgba(0,0,0,0.2);
-moz-box-shadow:0 5px 10px rgba(0,0,0,0.2);
box-shadow:0 5px 10px rgba(0,0,0,0.2);
-webkit-background-clip:padding-box;
-moz-background-clip:padding;
background-clip:padding-box;
margin:1px 0 0;
padding:4px 0;

.navbar .dropdown-menu:after {
position:absolute;
top:-6px;
left:10px;
display:inline-block;
border-right:6px solid transparent;
border-bottom:6px solid #fff;
border-left:6px solid transparent;
content:'';

.open .dropdown-menu {
display:block;
}

<span class="navbar">
            <span class="dropdown">
                <a data-toggle="dropdown" class="comment" href="#">Comment</a>
                <ul class="dropdown-menu">
                    <li><input type="text"></li>
                </ul>
            </span>
            </span>
4

1 に答える 1

1

私が理解しているように、あなたはhttp://jsfiddle.net/H3Vnw/1/を望んでいるかもしれません。このように書く

$('.comment').click(function(){
    $('.dropdown-menu').css({'display': 'block'});
});

更新しました

このように書く

var com = $('.comment');
var menu = $('.dropdown-menu');

        com.click(function() {
            menu.show(); return false;
        });

        $(document).click(function() {
            menu.hide();
        });

        menu.click(function(e) {
            e.stopPropagation();
        });

これをチェックしてくださいhttp://jsfiddle.net/H3Vnw/4/

于 2012-08-13T09:30:26.587 に答える