[英]Conflict with script and 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
如果我沒記錯的話,請將腳本中的所有$都更改為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>
在<head>
對jQuery腳本文件的引用的正下方
如果將“ $”作為參數,則可以使用“ $”代替jQuery。
jQuery(document).ready(function($) { $('a[name=modal]').click(function(e) { e.preventDefault(); var id = $(this).attr('href');
這只是一個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
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.