引导模式中的jquery选择器,带有下拉菜单

时间:2015-02-09 08:19:00

标签: jquery twitter-bootstrap

我有一个带有几个下拉菜单的bootstrap模式。我想要的是当我点击其中一个下拉列表中的项目 - 模态应该关闭时 - 应该抓取点击的文本并将其放置在跨度“target”中名为“choice”的锚标记中。

这是我尝试的脚本,但它不起作用:

<script>
    $(" .dropdown-menu li a").click(function () {
        $("#target").text($(this).text());
        $('#myModal').modal('hide');

    });
</script>

这是HTML:

<div class="modal fade" id="myModal">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <!-- Modal Header -->
            <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                    <h2 class="modal-title">Tittle"</h2>
                </div>
            <!-- Modal Body -->
            <div class="modal-body">
                <div class="row">
                    <div class="col-md-4">
                        <h2>Title</h2>
                        <div class="dropdown">
                            <button class="btn btn-default dropdown-toggle" type="button" id=" menu1" data-toggle="dropdown"></button>
                            <ul class="dropdown-menu dropdown-menu-right" role="menu" aria-labelledby="menu1">
                                <li role="presentation"><a role="menuitem" tabindex="-1" href="#choice">somthing1</a></li>
                                <li role="presentation"><a role="menuitem" tabindex="-1" href="#choice">somthing2</a></li>
                                <li role="presentation"><a role="menuitem" tabindex="-1" href="#choice">somthing3</a></li>
                                <li role="presentation"><a role="menuitem" tabindex="-1" href="#choice">somthing4</a></li>
                            </ul>
                        </div>
                    </div>
                    <div class="col-md-4">
                        <h2>Title</h2>
                        <div class="dropdown">
                            <button class="btn btn-default dropdown-toggle" type="button" id="menu1" data-toggle="dropdown"></button>
                            <ul class="dropdown-menu dropdown-menu-right" role="menu" aria-labelledby="menu1">
                                <li role="presentation"><a role="menuitem" tabindex="-1" href="#choice">somthing5</a></li>
                                <li role="presentation"><a role="menuitem" tabindex="-1" href="#choice">somthing6</a></li>
                                <li role="presentation"><a role="menuitem" tabindex="-1" href="#choice">somthing7</a></li>
                                <li role="presentation"><a role="menuitem" tabindex="-1" href="#choice">somthing8</a></li>
                            </ul>
                        </div>
                    </div>
                    <div class="col-md-4">
                        <h2>Title</h2>
                        <div class="btn-group">
                            <button class="btn btn-default dropdown-toggle" type="button" id="menu1" data-toggle="dropdown"></button>
                            <ul class="dropdown-menu dropdown-menu-right" role="menu" aria-labelledby="menu1">
                                <li role="presentation"><a role="menuitem" tabindex="-1" href="#choice">somthing</a></li>
                                <li role="presentation"><a role="menuitem" tabindex="-1" href="#choice">Fafairs</a></li>
                                <li role="presentation"><a role="menuitem" tabindex="-1" href="#choice">somthing</a></li>
                                <li role="presentation"><a role="menuitem" tabindex="-1" href="#choice">Other</a></li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
            <!-- Modal Footer -->
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">
                    Close
                </button>
                <button type="button" class="btn btn-primary">Save changes</button>
            </div>
        </div>
    </div>
</div>

<div class="spacer">
    <a name="choice"></a>
</div>
<h2><span class="label label-danger">Here goes  <span id="target"></span>  text</span></h2>

0 个答案:

没有答案