在引导选择选项中显示当前值答案

【问题标题】：Display the current value in bootstrap select option在引导选择选项中显示当前值
【发布时间】：2019-07-11 03:44:55
【问题描述】：

我想过滤一些信息，所以当我点击一个按钮时，输入字段显示当前值。

例如：

当我选择水果然后单击过滤器按钮时，我希望水果的文本留在选择选项字段中。

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">

<select class="form-control">
  <option>-Select-</option>
  <option>Fruits</option>
  <option>Vegetables</option>
  <option>Animal</option>
</select>

<div class="form-group">
  <button type="submit" class="btn btn-primary">Filter</button>
</div>

【问题讨论】：

你的输入框在哪里？
@Tushar 抱歉没有输入字段，但选择选项字段
你可以使用 $("select").Val("Fruits");但我想知道当你点击提交 btn 时页面是否刷新？
@Akhilesh 雅。当我点击提交按钮时页面将刷新
那么你用的是get还是post的方法呢？

标签： javascript jquery html bootstrap-4

【解决方案1】：

试试这个

$(document).ready(function(){
    $("button").click(function(){
        $("select").val();
    });
});

【讨论】：

【解决方案2】：

试试（编辑：对不起，误解了你的问题）

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-3.4.1.slim.min.js"></script>
        <select id='se' class="form-control">
    <option value="">-Select-</option>
      <option>Fruits</option>
      <option>Vegetables</option>
      <option>Animal</option>
    </select>

    
     <button class="btn btn-primary" onclick="$(function(){$('option:checked').removeClass('d-none').siblings().addClass('d-none')});">Filter</button>

【讨论】：