如何捕获div的索引并将选定的属性添加到jQuery中相同索引的选项

我创建了一组具有相同类和select元素的div元素。当我点击特定的div项目时，它应该捕获该索引并将所选属性添加到相同索引option。我尝试了类似于下面的内容，但将selected属性添加到所有option元素。如何捕获div的索引并将选定的属性添加到jQuery中相同索引的选项

.container, .selectItem { 
    display: block; 
    float: left; 
    width: 200px; 
}

<div class="container"> 
    <div class="group"> 
     <a class="change">ABC</a> 
    </div> 
    <div class="group"> 
     <a class="change">PQR</a> 
    </div> 
    <div class="group"> 
     <a class="change">XYZ</a> 
    </div> 
</div> 

<div> 
    <select class="selectItem"> 
     <option>ABC</option> 
     <option>PQR</option> 
     <option>XYZ</option> 
    </select> 
</div>

$(document).ready(function() { 
    $('a.change').click(function(){ 
     var changeIndex = $(this).closest('.group').index('.group'); 
     console.log(changeIndex); 
     $('.selectItem').find('option').attr("selected", "selected"); 
    }); 
})

来源

2015-10-12 chandru

http://jsfiddle.net/sandenay/8unsmgvo/ –

这是你正在尝试做什么？ –

是的Sandeep。感谢您的帮助。我发现了另一个解决方案： http://jsfiddle.net/chandru02010/d28xhstw/ – chandru

试试这个：

$('a.change').click(function(){ 
    var idx = $(this).parents('.group').index(); 
    $('.selectItem option').eq(idx).attr("selected", "selected"); 
});

见Fiddle

来源

2015-10-12 07:12:02 haim770

我做了这样的事情：

只改变

.... 
var index = $(this).closest(".group").index(); 

//console.log(text); 
$('.selectItem').find('option').eq(index).attr("selected","selected"); 
....

$(document).ready(function(){ 
 

 

 
$('a.change').click(function(){ 
 
    
 
    var index = $(this).closest(".group").index(); 
 
    
 
    //console.log(text); 
 
    $('.selectItem').find('option').eq(index).attr("selected","selected"); 
 

 

 
}); 
 

 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<div class="container"> 
 
<div class="group"> 
 
    <a class="change">ABC</a> 
 
</div> 
 
<div class="group"> 
 
    <a class="change">PQR</a> 
 
</div> 
 
<div class="group"> 
 
    <a class="change">XYZ</a> 
 
</div> 
 
</div> 
 

 
<div> 
 
<select class="selectItem"> 
 
     <option>ABC</option> 
 
     <option>PQR</option> 
 
     <option>XYZ</option> 
 
</select> 
 
</div>

来源

2015-10-12 07:15:15

感谢所有回答我的问题。 :) – chandru

这里是jquery的grep的解决方案，如果在div的值是在组合框中完全相同：

$('a.change').click(function(){ 
     var $currentItem=$(this); 
     var $optionToSelect=$($.grep($('.selectItem option'),function(item,index){ 
     return $(item).text().toLowerCase()===$currentItem.text().toLowerCase() 
    })).attr('selected','selected'); 
    });

来源

2015-10-12 11:10:40 AlexBerd

如何捕获div的索引并将选定的属性添加到jQuery中相同索引的选项

回答

相关问题