jQuery Mobile：选择选项时：做点什么。 （显示/隐藏元素）

Question

在过去的 6 个小时里，我一直在努力解决这个问题，但我找不到解决方案。我正在使用 jquery mobile 1.4.5。我有 5 个选项。它们都被选中，当一个被取消选择时，我想做点什么。所以我想获得取消选择选项的ID。这是我的html：

<ul data-role="listview" data-inset="false" data-icon="false" data-divider-theme="b">
<li data-role="list-divider"><h2>Upcoming events <button data-role="none" class="filter" type="submit">
<i class="fa fa-filter"></i> 
</button><button onclick="hide()">Hide social</button><button onclick="show()">show social</button><h2></li>
<div class="ui-field-contain sixtynine" data-position-to="window">
<select name="select-custom-19" id="filter-type" multiple="multiple" data-native-menu="false">
    <option>Filter events</option>
    <option value="1" selected="selected" id="f-1">family</option>
    <option value="2" selected="selected" id="f-2">friends</option>
    <option value="3" selected="selected" id="f-3">business</option>
    <option value="4" selected="selected" id="f-4">social</option>
    <option value="5" selected="selected" id="f-5">private</option>
</select>
</div>
<li data-role="list-divider"><h2>Today<h2></li>
// irrelevant

“隐藏社交”和“显示社交”工作。而且我希望能够在选择中拥有他们的行为。因此，我有一个选择选项，而不是 2 个按钮（1 个显示，1 个隐藏），选中时显示元素，未选中时隐藏它。其他 4 个选项同上。

那么我该如何解决呢？

Answer 1

可以使用jquery提供的on('change')函数：

$('#filter-type').on('change', function (e) {
    var optionSelected = $("option:selected", this);
    console.log(optionSelected);
    var valueSelected = this.value;
    ....
});

jquery select change event get selected option