1

我有这个选择

<select name="clients[]" size="20" multiple="multiple" id="clients" style="min-width:275px;">
<option id="first">First</option>
<option id="second">Second</option>
<option id="third">Third</option> 
</select>

我试图让这个警报框在 id = first 时出现，我试过了

$(document).ready(function(){
    if($('#clients option:selected').val() == 'first'){
        alert('hi');
    }
});

但什么都没有出现......我做错了什么

4

3 回答 3

1

值是First，不是first。由于您没有提供value属性，因此将option元素的内容作为值。

请注意，您使用的是多选字段。在这种情况下，浏览器不会选择页面*上的元素，因此只有first在选择发生变化时进行测试才有意义。

您必须检查是否First是所选元素之一：

$('#clients').change(function(){
      if($(this).children('option:selected').filter('#first').length) {
          alert('hi');
      }
});

演示

另一种选择是正确设置value属性而不是 ID，并查看值是否在 values 数组中：

HTML：

<option value="first">First</option>
<option value="second">Second</option>
<option value="third">Third</option>

JS：

$('#clients').change(function(){
      if($.inArray("first", $(this).val()) != -1) {
          alert('hi');
      }
});

演示

*：如果您可能selected事先在某些元素上设置了属性并希望在页面加载时运行测试，您可以通过调用.change()select 元素简单地触发 change 事件。

于 2012-06-21T19:07:14.017 回答
0

您已经在 html 中设置了选项 id 而不是值。另外，在 jQuery 中要查找选定的值，您只需要查找 select 元素的值。

改为这样做：

<option value="first">First</option>
<option value="second">Second</option>
<option value="third">Third</option> 

$(document).ready(function(){
    if($('#clients').val() == 'first'){
        alert('hi');
    }
});

如果您希望它实时显示弹出窗口，请执行以下操作：

$(document).ready(function(){
  $('#clients').change(function(){
    if($(this).val() == 'first'){
      alert('hi');
    }
  });
});
于 2012-06-21T19:10:48.390 回答
0

First如果选择在文档准备就绪时选择，并且当用户更改选择时，此代码会触发警报

$(function(){
   checkSelection();

   $('#clients').change(function(){
      checkSelection();
   })

   function checkSelection(){
       var selectedOptions = $('#clients').val();

       if($.inArray('First',selectedOptions) != -1){
           alert('hi'); 
       }
   }  
})
于 2012-06-21T19:07:35.720 回答