JQuery 문제 : 숨겨진 객체 표시

Question

내 코드를 올바르게 작성하는 데 문제가 있습니다. 나는 내 지식이 충분하지 않아서 그것을 분류 할 수 없을 것 같아서, 아마도 여러분 중 한 분이 제 코드를 친절하게 고칠 수 있을지 물어볼 것입니다.

그래서 난 달성하기 위해 노력하고 무엇을 : 나는 분리 된 DIV로 표시 관리 S의 M의 L 크기를 가진 선택하고 옵션 드롭 다운을 가지고 http://jsfiddle.net/yHHFJ/

$('[class^=is]').hide(); 
$("#select_2").change(function(){   
var value = $("#select_2 option:selected").val(); 
var theDiv = $(".is" + value); 

theDiv.slideDown(); 
theDiv.siblings('[class^=is]').slideUp(); 
}); 

var $j = jQuery.noConflict(); 
function changesizedropdown(size){ 
var option = size; 
var select = document.getElementById("select_2"); 
var opt, o = 0; 
while (opt = select[o++]){ 
if (opt.value == option){ select.selectedIndex = o - 1; } 
} 
} 

$j(document).ready(function() { 

var swatch =''; 
$j('#sizebox:eq(0) option').each(function() {swatch = swatch + "<li> <a href='javascript:void(0)' onclick='changesizedropdown(&amp;quot;"+ $j(this).val() +"&amp;quot;);'>" + $j(this).text() + "</a></li>"}); 
var sizeswatchhtml = "<div class='size'><div style='float: left; margin: 6px 5px 0px 0px;'>SELECT SIZE : </div><div style='float: left; margin: 0pt 7px 0px 13px;'><ul>"+ swatch + " </ul></div></div>"; 
document.getElementById('sizeswatch').innerHTML = sizeswatchhtml; 

}); 

. 또한 S (쇼 소형), M (쇼 중형) 또는 L (대형보기)를 클릭 할 때 표시되어야하는 숨겨진 DIV (중소형, 중형)를 가지고 있지만 표시되지 않으며 제작시 어려움을 겪고 있습니다. 맞아.

제발 도와 줄 수있어?

정말 감사드립니다.

Answer 1

스크립트에 약간의 변경이 있었으며 현재로서는 문제가없는 것처럼 보입니다.

<script> 

var $j = jQuery.noConflict(); 
$j('[class^=is]').hide(); 


$j("#select_2").change(function(){   
process(); 
}); 
function process() 
{ 
var value = $j("#select_2 option:selected").val(); 
var theDiv = $j(".is" + value); 
theDiv.slideDown(); 
theDiv.siblings('[class^=is]').slideUp(); 
} 
function changesizedropdown(size){ 
var option = size; 
var select = document.getElementById("select_2"); 
var opt, o = 0; 
while (opt = select[o++]){ 
if (opt.value == option){select.selectedIndex = o - 1; process();} 
} 
} 

$j(document).ready(function() { 

var swatch =''; 
$j('#sizebox:eq(0) option').each(function() { 
swatch = swatch + "<li> <a href='javascript:void(0)' onclick='changesizedropdown(\""+  $j(this).val() +"\");'>" + $j(this).text() + "</a></li>"}); 
var sizeswatchhtml = "<div class='size'><div style='float: left; margin: 6px 5px 0px 0px;'>SELECT SIZE : </div><div style='float: left; margin: 0pt 7px 0px 13px;'><ul>"+ swatch + " </ul></div></div>"; 
document.getElementById('sizeswatch').innerHTML = sizeswatchhtml; 

}); 

첫 번째 변화는 내가 사용하고 있다는 것입니다 \ "& quot 대신에, 그것은 오류를주고 있었다으로

두 번째 변화는 당신의 선택 인덱스를 변경 한 후에도이다. 드롭 다운 목록에서 변경 이벤트가 발생하지 않았으므로 changeizedropdown 함수에서 명시 적으로 호출했습니다.

세 번째 변경 사항은 위에 noconflict 문을 작성하고 $ j의 모든 위치를 사용했습니다. 어디에.

감사합니다.