Question

虽然StackOverflow上发布了类似的问题，但这并没有解决我的问题。所以我有一个下拉列表，其选项会在更改时执行某些操作，基本上，它们会提交表单并相应地更改数据。以下是显示下拉列表的示例代码

<select class="select" onchange="submitData()"  id="Filter">
  <option value="-1" selected="">Items</option>
  <option value="0">Unread</option>
  <option value="1">Read</option>
</select>

这是我们从下拉菜单中更改项目时调用的函数。

<script>
  submitData = function () {document.formHeader.submit();}
</script>

在＆＃34; formHeader＆＃34;中，有一个用于显示数据的表单。当我更改下拉数据中的项目时，相应地进行更改所以基本上我想将submitData功能转换为列表。有办法吗？

Answer 1

使用更改事件

<select class="select" id="Filter">
  <option value="-1" selected="">Items</option>
  <option value="0">Unread</option>
  <option value="1">Read</option>
</select>

更改获取值并决定您要提交的表单

$("#Filter").change(function () {
  var val = $(this).val();
  if(val == -1)
  {
    $( "#ItemForm" ).submit();
  }
  else if(var == 0)
  {
    $( "#UnreadForm" ).submit();
  }
  else
  {
    $( "#ReadForm" ).submit();
  }
});

希望这有助于你

使用列表

<ul>
  <li class="filter" data-form="ItemForm">Items</li>
  <li class="filter" data-form="UnreadForm">Unread</li>
  <li class="filter" data-form="ReadForm">Read</li>
</ul>

<script type="text/javascript">
  $(function () {
    $('.filter').click(function(){
      var form = $(this).data('form');
      $('#'+form).submit();
    })  
  });
</script>

如何模仿下拉列表的功能？

1 个答案: