프로토 타입과의 Jquery 충돌

Prototype에서 '라이트 박스'를 사용하고 Jquery에서 'CSV로 내보내기'를 사용했습니다. 현재 프로토 타입은 Jquery 라이브러리와 충돌합니다. 아래 코드는 내보내기 기능입니다. 첫 번째 스크립트는 Jquery 내보내기 라이브러리이고 두 번째 스크립트는 자바 스크립트입니다.프로토 타입과의 Jquery 충돌

한번 추가 'jQuery.noConflict();' 내보내기 라이브러리의 첫 번째 행에이 있으면 내보내기 기능이 작동하지 않습니다. 그래서 내 질문은 둘 다 같은 페이지에서 작동하도록하는 방법입니다.

<script type="text/javascript"> 

    jQuery.fn.table2CSV = function(options) { 
    var options = jQuery.extend({ 
     separator: ',', 
     header: [], 
     delivery: 'popup' // popup, value 
    }, 
    options); 


    var csvData = []; 
    var headerArr = []; 
    var el = this; 

    //header 
    var numCols = options.header.length; 
    var tmpRow = []; // construct header avalible array 

    if (numCols > 0) { 
     for (var i = 0; i < numCols; i++) { 
      tmpRow[tmpRow.length] = formatData(options.header[i]); 
     } 
    } else { 
     $(el).filter(':visible').find('th').each(function() { 
      if ($(this).css('display') != 'none') tmpRow[tmpRow.length] = formatData($(this).html()); 
     }); 
    } 

    row2CSV(tmpRow); 

    // actual data 
    $(el).find('tr').each(function() { 
     var tmpRow = []; 
     $(this).filter(':visible').find('td').each(function() { 
      if ($(this).css('display') != 'none') tmpRow[tmpRow.length] = formatData($(this).html()); 
     }); 
     row2CSV(tmpRow); 
    }); 
    if (options.delivery == 'popup') { 
     var mydata = csvData.join('\n'); 
     return popup(mydata); 
    } else { 
     var mydata = csvData.join('\n'); 
     return mydata; 
    } 

    function row2CSV(tmpRow) { 
     var tmp = tmpRow.join('') // to remove any blank rows 
     // alert(tmp); 
     if (tmpRow.length > 0 && tmp != '') { 
      var mystr = tmpRow.join(options.separator); 
      csvData[csvData.length] = mystr; 
     } 
    } 
    function formatData(input) { 
     // replace " with “ 
     var regexp = new RegExp(/["]/g); 
     var output = input.replace(regexp, "“"); 
     //HTML 
     var regexp = new RegExp(/\<[^\<]+\>/g); 
     var output = output.replace(regexp, ""); 
     if (output == "") return ''; 
     return '"' + output + '"'; 
    } 
    function popup(data) { 
     var generator = window.open('', 'csv', 'height=400,width=600'); 
     generator.document.write('<html><head><title>CSV</title>'); 
     generator.document.write('</head><body >'); 
     generator.document.write('<textArea cols=70 rows=15 wrap="off" >'); 
     generator.document.write(data); 
     generator.document.write('</textArea>'); 
     generator.document.write('</body></html>'); 
     generator.document.close(); 
     return true; 
    } 
}; 
     </script> 




     <script type="text/javascript"> 
     function getCSVData(){ 
      var csv_value=$('#insideTable5').table2CSV({delivery:'value'}); 
      $("#csv_text").val(csv_value); 
     } 
     </script> 



     <input type="image" src="images/Excel.jpg" value="Get CSV File" onclick="getCSVData()"/> 

     <table id='insideTable5' border='1'> 
      . 
      . 
      . 
     </table>

출처

2011-09-01 Acubi

당신이 그렇게 같은 코드 래핑 경우

(function($){ 

    // CODE HERE 

})(jQuery);

그런 다음 아직없는 충돌 후 작동됩니다. 이렇게하면 $이 여전히이 코드에서 jquery가되지만 외부에서는 jquery가됩니다.

자신의 함수에서 대신 jQuery을 사용하거나 noConflict를 사용하여 다른 변수 이름에 할당하십시오.

function getCSVData(){ 
    var csv_value=jQuery('#insideTable5').table2CSV({delivery:'value'}); 
    jQuery("#csv_text").val(csv_value); 
}

출처

2011-09-01 13:48:47

-1

두 개의 기능에 대해서만 두 개의 프레임 워크를로드하고 충돌을 걱정하는 대신 하나를로드하여 사용하십시오. 사용자가 다운로드 할 코드가 적어지고 JavaScript 코드베이스가 훨씬 쉽게 확장 가능하고 업데이트가 더 쉬워집니다.

JQuery에는 많은 라이트 박스 플러그인이 있습니다. 내 favs 중 하나는 http://colorpowered.com/colorbox/

입니다.

출처

2011-09-01 13:58:52 AlienWebguy

프로토 타입과의 Jquery 충돌

답변

관련 문제