需要帮助从列表项中获取文本并放入输入框

Question

我有以下 html 代码，下拉列表是一个列表

                        <div class="input-group m-bot15">
                            <input type="text" class="form-control round-input" id="textbox1">
                            <div class="input-group-btn">

                                <button tabindex="-1" data-toggle="dropdown" class="btn btn-info dropdown-toggle" type="button">
                                    <span class="caret"></span>
                                </button>
                                <ul role="menu" class="dropdown-menu pull-right">
                                    <li><a href="#">1</a></li>

                                    <li class="divider"></li>
                                    <li><a href="#" >2</a></li>
                                    <li><a href="#">3</a></li>
                                    <li><a href="#">4</a></li>
                                    <li class="divider"></li>

                                    <li><a href="#">5</a></li>
                                    <li class="divider"></li>
                                    <li><a href="#">6</a></li>
                                    <li><a href="#">7</a></li>
                                    <li class="divider"></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>

我正在尝试获取它，所以当我点击 1 时，它会将“1”放在推荐使用 Javascript 的人中。

这是我迄今为止尝试过的：

<li onmousedown="transferText(one)" id="one">1</li>

现在也添加您输入的文本和 id，例如 textBox

<script>
function transferText(listItem) {
    document.getElementById(textBox).innerHTML = document.getElementById(listItem).innerHTML;
}
</script>

Answer 1

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script>
    $(document).ready(function() {
        $('a', 'ul.dropdown-menu').click(function() {
            $('#textbox1').val($(this).text());
            return false;
        });
    });
</script>

Answer 2

var inputGroup = $('.input-group');

// Bind a click event to all elements with the selector ".dropdown-menu a" 
// within ".input-group" to an anonymous function that will insert the text
// value into the input. 
inputGroup.on('click', '.dropdown-menu a', function(event)
{
    // event = jQuery click event
    // this = The anchor that was clicked
    event.preventDefault();

    // Get the text value of the anchor and set it as the input value
    inputGroup.find('#textbox1').val($(this).text());
}