2010-01-08 3 views
1

Друзей у меня есть проблемы с JQuery и прототипом:Проблема JQuery и Prototype

<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> 

Браузер указует прототип ошибки.

Как я могу исправить это, когда решение?

Thankz

ответ

2

Фелипе, в этой ситуации, вы должны загрузить свои скрипты JQuery после других ваших сценариев. Затем, в верхней части ваших сценариев, вы должны позвонить jQuery.noConflict(); только один раз. Большинство будет переназначить $ в этот момент на что-то другое, например, var $j = jQuery;

Причина у вас возникли проблемы, потому что прототип пытается использовать $ переменные, которая уже связана с 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> 
+1

@Jim, вы можете также предоставить параметр в 'ready' события, как это:' JQuery (документ) .ready (функция ($) { ', а затем внутри всей этой функции вы можете использовать' '$ только он будет ссылаться на jQuery в этом контексте. Вне функции '$' остается определяемой как библиотека 'Prototype'. –

+0

Отличная точка, Дуг. –

1

Ваш код хорошо, вам просто нужно включить библиотеку JQuery после Прототип и Scriptaculous библиотеки. Остальная часть вашего кода должна функционировать должным образом.

<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> 
Смежные вопросы