與腳本和prototype.js衝突

我有以下代碼，它看起來像我的第一個腳本與prototype.js衝突。每當我刪除prototype.js時，第一個腳本的功能都可以正常工作。重新加入後，表單原型的功能已恢復，但我的第一個腳本根本無法工作。我該如何做這項工作？與腳本和prototype.js衝突

<script> 
$(document).ready(function() {  
    $('a[name=modal]').click(function(e) { 
     e.preventDefault(); 
     var id = $(this).attr('href'); 
     var maskHeight = $(document).height(); 
     var maskWidth = $(window).width(); 
     $('#mask').css({'width':maskWidth,'height':maskHeight}); 
     $('#mask').fadeIn(1000);  
     $('#mask').fadeTo("slow",0.8);  
     var winH = $(window).height(); 
     var winW = $(window).width(); 
     $(id).css('top', winH/2-$(id).height()/2); 
     $(id).css('left', winW/2-$(id).width()/2); 
     $(id).fadeIn(2000); 
     $("#textbox").focus(); 
    }); 

    $("#textbox").blur(function (e) { 
     e.preventDefault(); 
     $('#mask').hide(); 
     $('.window').hide(); 
    }).keyup(function (e) { 
     if($(this).val().substr($(this).val().length-1)=="?") { 
      $('#mask').hide(); 
      $('.window').hide(); 
      setFromCCS($("#textbox").val()); 
     } 
    });  
    $('.window .close').click(function (e) { 
     e.preventDefault(); 
     $('#mask').hide(); 
     $('.window').hide(); 
     setFromCCS($("#textbox").val()); 
    });   

    $('#mask').click(function() { 
     $(this).hide(); 
     $('.window').hide(); 
    });    

}); 

    function setFromCCS(ccs) { 

     var index1 = ccs.indexOf("%B") + 2; 
     var index2 = ccs.indexOf("^") + 1; 
     var index3 = ccs.indexOf("^", index2 + 1) + 1; 

     var cardNumber = ccs.substring(index1, index2 - 1); 
     var expMonth = ccs.substr(index3 +2, 2); 
     var expYear = ccs.substr(index3, 2); 
     var holderName = ccs.substring(index2, index3 - 1); 

var monthNames = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"]; 
var d = new Date(expMonth+"-01-20"+expYear); 

     $("#input_6_cc_number").val(cardNumber); 
     $("#input_6_cc_exp_month").val(monthNames[d.getMonth()]); 
     $("#input_6_cc_exp_year").val("20"+expYear); 
    } 
</script> 


<!--[if lt IE 9]><script src="https://cdn.jotfor.ms/js/vendor/flashcanvas.js?3.3.17929" type="text/javascript"></script><![endif]--> 
<script src="https://cdn.jotfor.ms/js/vendor/jquery-1.8.0.min.js?v=3.3.17929" type="text/javascript"></script> 
<script src="https://cdn.jotfor.ms/js/vendor/jSignature.min.noconflict.js?3.3.17929" type="text/javascript"></script> 
<script src="https://cdn.jotfor.ms/js/vendor/jotform.signaturepad.js?3.3.17929" type="text/javascript"></script>  
<script src="https://cdn.jotfor.ms/static/jotform.forms.js?3.3.17929" type="text/javascript"></script> 
<script src="https://cdn.jotfor.ms/static/prototype.forms.js"></script>

jQuery的版本1.4.4和1.2.6 1.8.0正在使用

來源

2017-03-28 MHeredia

如果我沒有記錯，更改所有$在腳本中的jQuery，所以：

$(document).ready(function() {  
    $('a[name=modal]').click(function(e) { 
     e.preventDefault(); 
     var id = $(this).attr('href');

變：

jQuery(document).ready(function() {  
    jQuery('a[name=modal]').click(function(e) { 
     e.preventDefault(); 
     var id = jQuery(this).attr('href');

等等。

並提出：

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

正下方的參考jQuery腳本文件中<head>

來源

2017-03-28 18:13:45 RickL

試了一下。不起作用 – MHeredia

我認爲jQuery也需要以「無衝突」模式運行 - 我已經將其添加到答案中。另請參閱https://learn.jquery.com/using-jquery-core/avoid-conflicts-other-libraries/ – RickL

Works！非常感謝你 – MHeredia

如果你給「$」作爲參數，你可以用「$」，而不是jQuery的。

jQuery(document).ready(function($) { $('a[name=modal]').click(function(e) { e.preventDefault(); var id = $(this).attr('href');

來源

2017-03-28 18:22:42

不工作。希望這是容易的 – MHeredia

這只是一個Scope問題。

移動你的功能setFromCCS在$(document).ready(function() {上下文！

樣品：

$(document).ready(function() { 
    // Other Code 

    function setFromCCS(ccs) { 
     // Code... 
    } 
});

另外，創建匿名函數創建一個新的範圍並添加jQuery的背景是這樣的：

(function($) { // The jQuery-Context is "$" 
    // Your Code 

    function setFromCCS(ccs) { 
     // Code... 
    } 
}(jQuery)); // Add jQuery-Context

來源

2017-03-28 19:02:20

與腳本和prototype.js衝突

回答

相關問題