具有noConflict和noConflict变量赋值的jQuery

Question

我一直在一页上使用2个不同版本的jQuery，并试图利用'noConflict'。
如果我为每个jQuery版本都建立了一个变量（例如$ a和$ b），我是否将所有$都替换为$ a和$ b？

例如（完整代码的片段[显示在底部]）..不确定将$ b放在哪里。

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

下面是HTML表单代码，jQuery克隆功能以及日期选择器功能。 当前，当我启用一个功能时，另一个功能不起作用。 感谢您的潜在客户。

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

Answer 1

请尝试以下方法：

1. 包括原始版本。

2. 然后包括Zebra datepicker所需的版本。

紧接着，您不需要任何冲突处理，只需使用$调用您的插件。 确保console.log('$.fn.jquery');

使用插件后，您需要调用oldV = jQuery.noConflict( true ); 将全局范围内的jQuery变量恢复到加载的第一个版本。 在下面的代码中，通常使用$ 。

Answer 2

如果我为每个jQuery版本都建立了一个变量（例如$ a和$ b），我是否将所有$都替换为$ a和$ b？

是的，您必须这样做，从声明变量的行开始，您只能使用该变量声明来调用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.