Question

我有一个名为“FavoriteFoods”的下拉菜单。在这个下拉列表中，我有4个选择，“披萨”，“寿司”，“汉堡”和“Biryani。”

从“最喜欢的食物”下拉菜单中，当我选择其中一个选项时，我想要一个Toast弹出窗口来提醒“很棒的选择！”

我如何实现这一目标？

   <div class="col-md-3">
        <div class="form-group">
              <label>Request Type</label>
                <select name="FavoriteFoods" class="form-control select2" style="width: 100%;" required>
                   <option value="" disabled selected>Select your favorite food</option>
                    <option value="Pizza">Pizza</option>
                     <option value="Sushi">Sushi</option>
                     <option value="Burgers">Burgers</option>
                     <option value="Biryani">Biryani</option>
               </select>
       </div><!-- /.form-group -->
    </div><!-- /.col -->

Answer 1

您可以为select和toast消息绑定onchange事件。请找到如下工作示例

Jsfiddle Example

public class MainActivity extends AppCompatActivity implements AsynkTaskResponse {

      @Override
      protected void onCreate(Bundle savedInstanceState) {
           super.onCreate(savedInstanceState);
           setContentView(R.layout.activity_main);

          //Start Request
          RequestManager.requestPostExample requestPostExample = new RequestManager.requestPostExample(this, exampleID, exampleData);
          requestPostExample.response = this;
          requestPostExample.execute();

      }

      @Override
      public void resultPostExample(String result){
            //here you get the result of the asynktask
      }
}

Answer 2

假设您正在使用JQuery，您可以这样做

$(".select2").change(function(){
     alert(this.val());  // you can use your custom alert options like toastr 
});

Answer 3

使用jquery从选择框中选择值。然后比较它并显示警告。示例演示：

＆＃13;

$( "select[name*='FavoriteFoods']" ).change(function(event){
    console.log($(this).val());

    if($(this).val() == 'Pizza' || $(this).val() == 'Sushi'){
      alert("Great choice ")
    } else{
      alert("Selected item is"+ $(this).val())
    }
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="col-md-3">
        <div class="form-group">
              <label>Request Type</label>
                <select name="FavoriteFoods" class="form-control select2" style="width: 100%;" required>
                   <option value="" disabled selected>Select your favorite food</option>
                    <option value="Pizza">Pizza</option>
                     <option value="Sushi">Sushi</option>
                     <option value="Burgers">Burgers</option>
                     <option value="Biryani">Biryani</option>
               </select>
       </div><!-- /.form-group -->
    </div><!-- /.col -->

＆＃13;

如何在下拉列表中显示多个选项的Toast警报？

3 个答案: