html中select標(biāo)簽的選項(xiàng)攜帶多個(gè)值

<select id="ddlEmployee" class="form-control">

　　<option value="">-- Select --</option>

　　<option value="1"      data-city="Washington" data-doj="20-06-2011"    >John</option>

　　<option value="2"      data-city="California"     data-doj="10-05-2015"    >Clif</option>

　　<option value="3"      data-city="Delhi"             data-doj="01-01-2008"    >Alexander</option>

</select>

<div class="col-sm-3">

　　<select id="typeId" name="typeId" class="form-control">

　　　　<ul th:each="productType:${productTypeList}">

　　　　　　<option th:data-pagetype="${productType.pageType}"

　　　　　　　　th:value="${productType.id}"

　　　　　　　　th:text="${productType.typeName}"

　　　　　　　　th:selected="${productType.id==news.typeId}">

　　　　　　</option>

　　　　</ul>

　　</select>

</div>

$(function(){

        $('#typeId').on('change',function(){

                //在這里執(zhí)行你需要的操作

                let selectedOption = $(this).find(':selected');

                var pageType = selectedOption.data('pagetype');

                if(pageType==4){

                        $('#commentOpened').css({display:'block'});

                }else{

                        $('#commentOpened').css({display:'none'});

                }

        });

});