为什么单击选项时无法获取jquery中所选选项的值？

我有以下带有选项的选择菜单

 <select name="assigneeSelect" id="{{this.commonID}}" class="custom-select sources" key="{{this.id}}" placeholder="{{this.assignee}}">
    <option value="5f4a31eb75d1ab1668d11765">Charlotte Miles</option>
    <option value="d91c3fb7642c6d415880301e1c776df4">Sulekha Yadav</option>
    <option value="5f4d49636dba221200f2cc1f">Adele Armstrong</option>
  </select>

---

但是在val中，虽然我得到了文本，但我没有得到选项的值。

您可以使用以下方法创建

自定义选项

：

<span class="custom-option ' + $(this).attr("class") + '" data-value="' + $(this).attr("value") + '">' + $(this).html() + '</span>'

$(".custom-option").on("click", function() {


**var text = $(this).text();**
**var val = $(this).val();**

alert("id ="+id+" text = "+text+" val ="+val);

}) 

<span class="custom-option ' + $(this).attr("class") + '" data-value="' + $(this).attr("value") + '">' + $(this).html() + '</span>'

var val = $(this).data("value");