내 jQuery 스크립트가 Firefox에서만 작동하는 이유는 무엇입니까?

Question

다른 브라우저 간 문제와 비슷한 점이 몇 가지 있지만 jQuery에서 사용하는 기능이 무엇인지 알아 내려는 것 같습니다. 여기 내 HTML 문서에 나타나는 jQuery의 두 부분이 있습니다. 내 질문을 위해 두 개의 스크립트 태그가 있습니다. 그것은 Firefox에서만 실행되는 두 번째 스크립트 태그입니다. Safari 나 Chrome에서는 작동하지 않습니다 (또는 콘솔에 로그인하는 경우조차도). 그래서

jQuery(document).ready(function() { 


}); 

은 그것이 있어야

<script type="text/javascript"> 
jQuery(document).ready(function() { 
      jQuery("#product_accordion_custom a").click(); 
      jQuery('#product_tabs_product_review_contents').appendTo('.product-collateral'); 

      //toothbrush changing - image to menu 
      var colorDropDown = jQuery("select#attribute92"); 
      var colorOptions = jQuery("select#attribute92 option"); 

       jQuery("div.slide a").click(function(e){ 
        var color = jQuery(this).find("img")[0].alt; 
        //colorDropDown.val(color).change(); 
        for(var i = 0;i<colorOptions.length;i++){ 
         s_color = colorOptions[i].innerText; 
         if(s_color==color){ 
          colorDropDown.val(colorOptions[i].value).change(); 
         } 
        } 

       }); 
     }); 
</script> 

<script type="text/javascript"> 
//toothbrush changing - menu to image 
jQuery(document).on("click", "select#attribute92 option:selected", function(){ 
    var selectorText = jQuery(this).text(); 
    var tag = jQuery("img[alt='"+selectorText+"']"); 
    jQuery("div.slide a").find(tag).click(); 
    console.log(selectorText); 
}); 
</script> 

Answer 1

다른 브라우저는 특정 가장자리의 경우 다른 이벤트를 방출 . Firefox는 드롭 다운에서 옵션을 선택하면 "클릭"이벤트가 발생합니다. 다른 브라우저는 그렇지 않습니다.

그러나 브라우저에 관계없이 "change"이벤트가 실행되어야합니다. 당신을 위해 다음과 같은 것이 효과가 있습니까?

jQuery(document).on("change", "select#attribute92", function(){ 
    var selectorText = jQuery(this).children(":selected").text(); 
    var tag = jQuery("img[alt='"+selectorText+"']"); 
    jQuery("div.slide a").find(tag).click(); 
    console.log(selectorText); 
}); 

편집 : 다른 답변에서 알 수 있듯이 또한, JQuery와 (문서) .ready() 함수의 내부를 배치하는 것은 좋은 방법이 될 것입니다.

Answer 2

이 코드를 둘 필요가

, 내

<script type="text/javascript"> 
//toothbrush changing - menu to image 
jQuery(document).on("click", "select#attribute92 option:selected", function(){ 
    var selectorText = jQuery(this).text(); 
    var tag = jQuery("img[alt='"+selectorText+"']"); 
    jQuery("div.slide a").find(tag).click(); 
    console.log(selectorText); 
}); 
</script> 

,

<script type="text/javascript"> 
jQuery(document).ready(function() { 
    //toothbrush changing - menu to image 
    jQuery(document).on("click", "select#attribute92 option:selected", function(){ 
     var selectorText = jQuery(this).text(); 
     var tag = jQuery("img[alt='"+selectorText+"']"); 
     jQuery("div.slide a").find(tag).click(); 
     console.log(selectorText); 
    }); 
}); 
    </script>