Question

我有一个下拉列表，其中包含组列表和组的相应项目。我想选择一个组，以便自动组项目也应根据下拉列表中的组选择进行选择。如果选择了组项目那么整个小组应该被取消选择

这是我的HTML代码：

  <option class="options" value="allinone" id="puneid" >Pune</option>
       <option class="options" value="1">pune-loc</option>
    <option class="options" value="2">pune-loc1</option>
    <option class="options" value="3">pune-loc2</option>
    <option class="options" value="16">pune-loc3</option>

    <option class="mumbai" value="allinone" id="mumbaiid" >Mumbai</option>
    <option class="mumbai" value="1">mum-loc</option>
    <option class="mumbai" value="2">mum-loc1</option>
    <option class="mumbai" value="3">mum-loc2</option>
    <option class="mumbai" value="16">mum-loc3</option>
    <option class="mumbai" value="26">mum-loc5</option>
</select>

我的js代码是：

$('#siteSelector').click(function(){
    var self = $(this);
    if(self.val() == 'all'){
       self.children().prop('selected',true).click()

    }
    else
    {
        self.find('.options:first').prop('selected', false)
    }
})
$('#mumbaiid').click(function(){
     var self = $(this);
    if(self.val() == 'allinone'){

       self.children().prop('selected',true).click()

    }
    else
    {
        self.find('.mumbai:first').prop('selected', false)
    }
    })

我想要一个输出，就像当我点击Pune时，pune下的位置应该选择，当我点击孟买时，孟买下面的位置应该选择。

当我们选择这两个城市时，那么孟买和浦那两个城市应该选择。当我们点击子地区时，那么只有子地点应该选择

Answer 1

**使用这个*

<select multiple>
<option class="options" value="allinone" id="puneid" >Pune</option>
<option class="options" value="1">pune-loc</option>
<option class="options" value="2">pune-loc1</option>
<option class="options" value="3">pune-loc2</option>
<option class="options" value="16">pune-loc3</option>

<option class="mumbai" value="allinone" id="mumbaiid" >Mumbai</option>
<option class="mumbai" value="1">mum-loc</option>
<option class="mumbai" value="2">mum-loc1</option>
<option class="mumbai" value="3">mum-loc2</option>
<option class="mumbai" value="16">mum-loc3</option>
<option class="mumbai" value="26">mum-loc5</option>

Answer 2

试试这个：

$('#mumbaiid').click(function(){
     var self = $(this);
    if(self.val() == 'allinone'){

       $("."+self.attr('class')).prop('selected',true);
       // or you can also use 
       // self.siblings("."+self.attr('class')).prop('selected',true);

    }
    else
    {
        self.find('.mumbai:first').prop('selected', false)
    }
    })

这是工作演示。 http://jsfiddle.net/ax0bhyy6/

你可以得到这样的选定值：

$("select option:selected").each(function (){
   alert($(this).val());
});

多个城市选择

2 个答案: