Javascript 如何使用list.js选择下拉选项对列表项进行排序

我正在使用list.js对列表项进行排序，但我想在更改

select>选项时对该项进行排序

HTML

<div id="hotels">
    <input class="search" placeholder="Search" />
    <button class="sort" data-sort="name">
      Sort by name
    </button>

    <select class="sort" data-sort="">
      <option value="" selected>Sort by</option>
      <option value="hotelName">Hotel Name</option>
      <option value="price">Price</option>
      <option value="star">Star</option>
    </select>

    <ul class="list">
      <li>
        <h3 class="hotelName">The Umrao</h3>
        <p class="price">5002</p>
        <p class="star">3</p>
      </li>
      <li>
        <h3 class="hotelName">Welcomhotel Dwarka, New Delhi</h3>
        <p class="price">8367</p>
        <p class="star">5</p>
      </li>
      <li>
        <h3 class="hotelName">Lemon Tree Premier, Delhi Airport</h3>
        <p class="price">3978</p>
        <p class="star">4</p>
      </li>
      <li>
        <h3 class="hotelName">Red Fox Hotel, Delhi Airport</h3>
        <p class="price">9676</p>
        <p class="star">2</p>
      </li>
    </ul>
  </div>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script src="http://listjs.com/no-cdn/list.js"></script>

您应该使用
hotelList.sort
功能：


var选项={
ValueName:['hotelName'、'price'、'star']
};
var hotelList=新列表（“酒店”，选项）；
$（'select.sort'）.change（函数（）{
var selection=$（this.val（）；
hotelList.sort（选择）；
});
$（'button.sort'）。单击（函数（）{
hotelList.sort（$（this.data（'sort'））；
});

按名称排序
排序
酒店名称
价格
明星


Umrao
5002
3


新德里德瓦卡韦尔科姆酒店
8367
5


柠檬树总理，德里机场
3978
4


德里机场红狐酒店
9676
2


sort（）是列表的jquery函数。JA还有一件事是，有什么方法可以从低到高或从A到Z排序，例如，在select中，有两个选项可以选择价格
price low to high price high to low
var options = {
  valueNames: [ 'hotelName', 'price', 'star' ]
};

var hotelList = new List('hotels', options);

$('.sort').change(function(){
  var selection = $(this).val();
  console.log(selection);
  $(this).attr('data-sort', selection);
});