Question

我创建的代码只有在从下拉列表中选择一个类别时才显示div，我在css中创建了div display:none并使用此代码及其工作在jquery中显示它，

$(' select[name=catId]').change(function(e){
      if ($(' select[name=catId]').val() == '32'){
        $('#photo-upload').hide();
      }else{
        $('#photo-upload').show();
      }
    });

但是这样它可以为选项值32工作，但我想让它适用于很多值，我试过这样但是它不起作用

 $(' select[name=catId]').change(function(e){
          if ($(' select[name=catId]').val() == '32' '45' 67' 89' 122'){
            $('#photo-upload').hide();
          }else{
            $('#photo-upload').show();
          }
        });

请指导我如何隐藏其他值，而不仅仅是32，现在只为一个值为我工作。

更新：这是我的html结构

<select name="catId" id="catId">
    <option value="1">England</option>
    <option value="2">Russia</option>
    <option value="3">Antartika</option>
    <option value="4">Maldives</option>
    <option value="32">Alaska</option>
    <option value="45">Seychelles</option>
    <option value="67">Georgia</option>
    <option value="89">Honduras</option>
    <option value="7">Lebanon</option>
    <option value="8">Switzerland</option>
    <option value="122">Germany</option>
</select>
<div id="photo-upload">photo uploader here</div>

以下是fidlle演示：http://jsfiddle.net/Bk54E/

Answer 1

像这样使用OR运算符

$("select[name='catId']").change(function(e){

    var res = $(this).find("option:selected").val() ;

    if (res == '32' || res == '45' || res == '67' || res == '89' || res == '122'){

         $('#photo-upload').hide();

      }else{

          $('#photo-upload').show();

      }
 });

Fiddle

Answer 2

使用

在jquery中使用 inArray

$.inArray( $(' select[name=catId]').val(), [ '32', '45', '67', '89', '122' ] );

OR

 $.inArray( this.value , [ '32', '45', '67', '89', '122' ] );

您的JS代码将是

$("select[name='catId']").change(function(){
       if( $.inArray(this.value, ['32', '45', '67', '89', '122' ] )!=-1){
            $('#photo-upload').hide();
          }else{
            $('#photo-upload').show();
          }
        });

DEMO

Answer 3

更好地使用这样的东西。

if(['32', '45', '67', '89', '122'].indexOf($(' select[name=catId]').val())>-1){
     //hide
}

所以基本上如果其中任何一个等于select's value条件就是真的。

Answer 4

您可以这样使用：

var selValue = ['32', '45', '67', '89', '122'];

if ($(' select[name=catId]').val() == $.inArray(this.value, selValue){

Answer 5

你可以在内置函数的jquery中尝试使用inArray

<html>
    <body>

        <select name="category">
          <option value="31">Volvo</option>
          <option value="32">Saab</option>
          <option value="33">Mercedes</option>
          <option value="34">Audi</option>
        </select> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    </body>
<html>

    <script>
    $(document).ready(function(){

        var category1 =[31,32];
        var category2 =['33'];
        var category3 =['34']
        $('select[name=category]').change(function(){

            var selectedValue = $('select[name=category]').val();
            if($.inArray(selectedValue,category1) != -1)  {
                alert('hey u have selected category 1');
            }else if($.inArray(selectedValue,category2) != -1)  {
                alert('hey u have selected category 2');
            }else if($.inArray(selectedValue,category3) != -1)  {
                alert('hey u have selected category 3');
            }else{
                alert('invalid category');
            }

        });

    });
    </script>

有关数组操作的更多信息，请访问此处 How do I check if an array includes an object in JavaScript?

如何向jquery代码添加多个值

5 个答案:

DEMO