Frknozsoy adlı üyeden alıntı: mesajı görüntüle
Secilen optionun indis değerine göre divlerin açılmasını istiyorum bunu ul li iciın click olayı ile yapabiliyoruz ancak option icin seçme anlamına gelen olayı bilmiyorum.

Kodlarım şu şekilde bunun aynısının select halini rica ediyorum.

Şimdiden Teşekkürler.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Deneme</title>
<script src="jquery-1.11.2.min.js"></script>
<script type="text/javascript">
$(function(){
	$("div.tab_content").hide();
	$("div.tab_content:first").show();
	
	$("ul#tab li").click(function(e){
		
		var index = $(this).index();
		$("div.tab_content").hide(300);
		$("div.tab_content:eq(" + index + ")").show(300);
		return false
		
		});
	
	});
</script>
<style type="text/css">
body{font:12px Arial;}
ul,li{
	padding:0;
	margin:0;
}
ul#tab li{}

.tab_content{border:2px solid #ddd; padding:10px; color:#aaa; margin-top:10px;}
</style>
</head>
<body>

<ul id="tab">
<li>1.tab</li>
<li>2.tab</li>
<li>3.tab</li>
</ul>
<!-- 
burası için yapmak istiyorum
<select>
<option>1.tab</option>
<option>2.tab</option>
<option>3.tab</option>
</select>
-->
<div class="tab_content">1. Tab içeriği</div>
<div class="tab_content">2. Tab içeriği</div>
<div class="tab_content">1. Tab içeriği</div>


</body>
</html>






Çalışan örneği


http://codepen.io/CssValley/pen/XJeVJG


kodlar:


$(function(){
   $("div.tab_content").hide();
   $("div.tab_content:first").show();
    
   $("select").change(function(){
       
     var i = $("select option:selected").index();
     
    $("div.tab_content").hide();
    $("div.tab_content:eq("+i+")").show();
     
       
      });
    
   });

 
<select>
<option>1.tab</option>
<option>2.tab</option>
<option>3.tab</option>
</select>
 
<div class="tab_content">1. Tab içeriği</div>
<div class="tab_content">2. Tab içeriği</div>
<div class="tab_content">3. Tab içeriği</div>