Question

朋友我对jquery和原型有问题：

<head>           
<link rel="stylesheet" type="text/css" href="http://localhost/ecommerce/css/lightview.css" />
<script type="text/javascript" src="http://localhost/ecommerce/js/jquery-1.3.2.min.js" ></script>
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/prototype/1.6.1/prototype.js'></script>
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/scriptaculous/1.8.2/scriptaculous.js'></script>
<script type='text/javascript' src='http://localhost/ecommerce/js/lightview.js'></script>
</head>

代码2：

<script type="text/javascript">
jQuery.noConflict();
jQuery(document).ready(function(){

 //Esconde a div boleto
     jQuery("#boleto").css("display","none");

    //Adiciona evento onclick no checkbox com o nome de boleto
    jQuery("#cboleto").click(function(){
       jQuery.noConflict();
     //se checado:
     if (jQuery("#cboleto").is(":checked")){
      //mostra a div escondida
         jQuery("#boleto").show("fast");
     }else{     
      //caso contrario, esconde
         jQuery("#boleto").hide("fast");
     }
    });

 //esconde a div visa
    jQuery("#visa").css("display","none");

    //Adiciona evento onclick no checkbox com o nome de visa
    jQuery("#cvisa").click(function(){
       jQuery.noConflict();
     //se checado:
     if (jQuery("#cvisa").is(":checked")){
      //mostra a div escondida
         jQuery("#visa").show("fast");
     }else{     
      //caso contrario, esconde
         jQuery("#visa").hide("fast");
     }
    });

 //esconde a div master
    jQuery("#master").css("display","none");

    //Adiciona evento onclick no checkbox com o nome de master
    jQuery("#cmaster").click(function(){
       jQuery.noConflict();
     //se checado:
     if (jQuery("#cmaster").is(":checked")){
      //mostra a div escondida
         jQuery("#master").show("fast");
     }else{     
      //caso contrario, esconde
         jQuery("#master").hide("fast");
     }
    });  

 //esconde a div pagseguro
    jQuery("#pagseguro").css("display","none");

    //Adiciona evento onclick no checkbox com o nome de pagseguro
    jQuery("#cpagseguro").click(function(){
       jQuery.noConflict();
     //se checado:
     if (jQuery("#cpagseguro").is(":checked")){
      //mostra a div escondida
         jQuery("#pagseguro").show("fast");
     }else{     
      //caso contrario, esconde
         jQuery("#pagseguro").hide("fast");
     }
    });

         });
</script>

浏览器指出错误PROTOTYPE。

如何解决这个问题呢？

Thankz

Answer 1

Felipe，在这种情况下，您应该在其他脚本之后加载jQuery脚本。然后，在脚本的顶部，您应该只调用jQuery.noConflict();一次。大多数人会在此时将$重新分配给其他内容，例如var $j = jQuery;

你遇到问题的原因是因为Prototype正在尝试使用已经与jQuery相关联的$变量。

有关详细信息，请参阅此页面：http://docs.jquery.com/Using_jQuery_with_Other_Libraries

所以，你应该这样：

<head>           
<link rel="stylesheet" type="text/css" href="http://localhost/ecommerce/css/lightview.css" />
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/prototype/1.6.1/prototype.js'></script>
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/scriptaculous/1.8.2/scriptaculous.js'></script>
<script type='text/javascript' src='http://localhost/ecommerce/js/lightview.js'></script>
<script type="text/javascript" src="http://localhost/ecommerce/js/jquery-1.3.2.min.js" ></script>

    <script type="text/javascript">
    jQuery.noConflict();

   jQuery(document).ready(function(){
      jQuery("#boleto").css("display","none");
       jQuery("#cboleto").click(function(){
          /* notice, jQuery.noConflict(); doesn't need to be here */
        if (jQuery("#cboleto").is(":checked")){
            jQuery("#boleto").show("fast");
        }else{     
            jQuery("#boleto").hide("fast");
        }
       });
       /* Then the rest of your code */
    });
    </script>
</head>

Answer 2

您的代码很好，您只需要在 Prototype和Scriptaculous库之后包含jQuery库。其余代码应按预期运行。

<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/prototype/1.6.1/prototype.js'></script> <script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/scriptaculous/1.8.2/scriptaculous.js'></script> <script type="text/javascript" src="http://localhost/ecommerce/js/jquery-1.3.2.min.js" ></script> <script type='text/javascript' src='http://localhost/ecommerce/js/lightview.js'></script>

问题jQuery和Prototype

2 个答案: