I've been working with 2 different versions of jQuery on one page and am trying to utilitze the 'noConflict.'
If I establish a variable for each of the jQuery versions, (examples: $a and $b), would I replace all of the $'s with '$a' and '$b?'
for example (a snippet of the full code [which appears at the bottom]).. wasn't sure where to put the $b's.
<script>
$b(document).ready(function() {
function clone(){
var $cloned = $('table tr:last').clone();
var oldIndex = $cloned.find('input').attr('name').match(/\d+/);
var newIndex = parseInt(oldIndex,10)+1;
$cloned.find('input').each(function(){
var newName = $(this).attr('name').replace(oldIndex, newIndex);
$(this).attr('name', newName);
});
$cloned.insertAfter('table tr:last');
}
$('p.add-btn').click(clone)
;
</script>
Below, is the HTML form code, along with the jQuery clone function, along with the date picker functions. Currently, when I enable one, the other function does not work. Thanks for any leads.
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script>var $a = jQuery.noConflict(true); //sets up 1st version of jquery to run for Zebra datepicker</script>
<script type="text/javascript" src="zebra_datepicker/js/zebra_datepicker.js"></script>
<link rel="stylesheet" href="zebra_datepicker/css/default.css" type="text/css">
<script>
$a(document).ready(function() {
$a('#SubmissionDate').Zebra_DatePicker({
view: 'years',
readonly_element: true
});
$a('#ClassYear').Zebra_DatePicker({
view: 'years',
format: 'Y',
readonly_element: true
});
});
</script>
<script>
$b(document).ready(function() {
function clone(){
var $cloned = $('table tr:last').clone();
var oldIndex = $cloned.find('input').attr('name').match(/\d+/);
var newIndex = parseInt(oldIndex,10)+1;
$cloned.find('input').each(function(){
var newName = $(this).attr('name').replace(oldIndex, newIndex);
$(this).attr('name', newName);
});
$cloned.insertAfter('table tr:last');
}
$('p.add-btn').click(clone)
;
</script>
<table id="FormLayout" cellspacing="3" cellpadding="3">
<tr>
<td class="FormLabel" width="100px"><strong>Class Year*</strong></td>
<td width="100px"><input type="text" id="ClassYear" name="ClassYear_1" class="required" value="<%= Request.form("ClassYear") %>" tabindex="4" /></td>
</tr>
<tr><td>
<button type="button" id="add-btn">Add Class Year</button>
</td></tr>
<tr>
<td colspan="4" align="center"><input type="hidden" name="FormSubmit" value="True" />
<input type="submit" value="Submit" tabindex="8" />
</td>
</tr>
</table>
答案 0 :(得分:1)
Please try this:
Include the original version.
Then include the version required by Zebra datepicker
.
Just after, you don't need any conflict handling, just call your plugin by using $
. To make sure console.log('$.fn.jquery');
After using your plugin you need to call oldV = jQuery.noConflict( true );
to restore globally scoped jQuery variables to the first version loaded. In the next code just use $
normally.
答案 1 :(得分:1)
如果我为每个jQuery版本建立一个变量(例如:$ a和$ b),我会用&#39; $ a&#39;替换所有$&#39;和&#39; $ b?&#39;
是的,你必须,从你声明一个指向前的变量的行开始,你只能使用该变量声明来调用jQuery函数/方法。
//Assume that by this time there is 'noConflict' declared variable you can still invoke a method of jquery using this.
$().
//But as you declared a 'noConflict' variable
var $a = jQuery.noConflict();
//$() would return undefined.