Javascript 使用jquery在悬停时打开下拉列表

我有一个带ul和li标签的下拉列表。它正在点击工作。我正在尝试打开鼠标悬停的下拉列表，而不是单击。我怎样才能做到这一点

<div class="ms-parent form-control">
    <button type="button">
        <span class="placeholder">Choose Anyone</span>
    </button>

    <div class="ms-drop bottom" style="display: none;">
        <ul>
            <li class="ms-select-all">
            <li>
            <label>
                <input type="checkbox" value="Abu Dhabi" undefined="">
                Computer
            </label>
            </li>
            <li>
            <label>
                <input type="checkbox" value="Al Ain" undefined="">
                Keyboard
            </label>
            </li>
            <li>
        </ul>
    </div>
</div>

输出类似于普通的html选择下拉列表。但我希望打开鼠标悬停事件的下拉列表。

$document.readyfunction{ $'BTNTOOSE'。悬停 作用{ $‘内容’。显示； }, 作用{ } ; }; 选择任何人 计算机 键盘

---

使用的悬停功能jquery@MahenderSingh仅出于这个原因包含jQuery是多余的。这可以通过CSS:hover来实现……我相信您当前的标记是无效的。我认为不能将一个元素直接嵌套在另一个元素中。您可以嵌套一个新的无序列表，然后新元素就在该列表中。然而，有很多关于此类功能的教程。你检查过了吗？如果是，请提供参考或代码段。然后，提及你们在哪里结巴，并向社区寻求帮助。重复问题-

  $('#btnToChoose')
  .on('mouseenter', function () { $('#content').show(); })
  .on('mouseleave', function () { $('#content').hide(); });