Prototype에서 JQuery로 스크립트를 변환하는 방법은 무엇입니까?

Question

아약스 호출을위한 프로토 타입 기능을 사용하는 상속 된 미완료 응용 프로그램을 작성한 다음 다른 목적으로 JQuery를 사용했습니다. 특정 순간에 필자는 jQuery $ .noConflict() 옵션을 사용하여 해결할 수없는 비 호환성 문제를 겪었으므로 모든 브라우저에서 모든 것이 원활하게 작동하기 때문에 프로토 타입을 유지했습니다. IE에서 테스트하려고했던 날을 제외하고 (버전 8). 스택 오버플로 오류를 계속 표시하고 응용 프로그램이 제대로 반응하지 않았습니다. 나는 단지 <meta http-equiv="X-UA-Compatible" content="IE=Edge"/>을 추가하여 헤더를 변경했지만 일부 연구 후에 IE가 프로토 타입 라이브러리를 부적절하게 처리하여 문제가 발생한 것으로 보입니다. 그래서 대신 Jquery로 모든 것을 전환하기로 결정했습니다. 프로토 타입을 사용하는 코드의 유일하게 남아있는 부분은 다음과 같다 :

function ajaxAll() { 
$('pro_search_form').onsubmit = function() { 
    initornot(); 
    inline_results(); 
    putmks(); 
    return false; 
} 
} 

function initornot() { 
var $elem = $('conteneur'); 
if($elem.getStyle('display') == 'none') { setTimeout("init();", 77); } 
else init(); 
} 

function inline_results() { 
new Ajax.Updater ('pro_description_div', base_url+'main/ajaxsearch', 
{ 
method:'post', 
postBody:'magasin=true&ltype='+$F('ltype')+'&lieu='+$F('lieu')+'&keywords='+$F('keywords') 
}); 
new Effect.Appear('conteneur', {duration: 2.0}); 
} 

function putmks() 
{ 
var url = base_url+'main/prosearch'; 
var myAjax = new Ajax.Request(
    url, 
    { 
    method: 'post', 
postBody:'magasin=true&ltype='+$F('ltype')+'&lieu='+$F('lieu')+'&keywords='+$F('keywords') 
    }); 
} 

그래서 JQuery와 구문을 사용하여 동일한 동작을 얻을 수를 변환하는 방법에 대한 어떤 생각?

기본적으로 첫 번째 함수 인 ajaxAll()은 양식의 제출 작업 (pro_search_form)을 수신 한 다음 inline_results() 함수를 호출하여 ajax 호출의 post 메소드와 putmks() 함수를 사용하여 나타나는 효과로 div를 업데이트합니다. 기본적으로 동일한 게시물 데이터 매개 변수를 보낸 후 url 'main/prosearch'의 컨트롤러에서 생성 된 반환 된 javascript 내용을 평가합니다 (이 함수는 프로토 타입 기능을 활용하여 모든 javascript를 자동으로 평가하므로 가장 중요한 부분입니다) 그것은 적절한 헤더 텍스트/자바 스크립트를가집니다). 세 번째 함수 initornot()은 조치를 취하기 전에 div의 표시 속성을 확인하는 것입니다.

NB : 사용 된 프로토 타입 버전은 1.5.0이고, 나는 마침내 다음 코드를 사용하여 수행되었다 그래 조금 개선

Answer 1

도와주세요 JQuery와는 1.7.1

입니다 :

$(document).ready(function(){ 

$("#pro_search_form").submit(function(e) { 

    allResults(); 
e.preventDefault(); 

}); 

function allResults() { 

$.post(base_url+"main/ajaxsearch", {'magasin':true, 'ltype':$("#ltype").val(), 'lieu':$("#lieu").val(), 'keywords':$("#keywords").val()}, function(results){ 
    $("#pro_description_div").html(results); 
    $("#conteneur").fadeIn("slow"); 
}); 

var elem = $("#conteneur").css("display"); 
if (elem == 'none') { setTimeout("init()", 84); } 
else {init();} 

$.post(base_url+"main/prosearch", {'magasin':true, 'ltype':$("#ltype").val(), 'lieu':$("#lieu").val(), 'keywords':$("#keywords").val()}, function(results){ 
    val(results); 
}); 
    } 

}) 

을

나는 내 자신의 질문에 대답하고 있지만 다른 사람들이 내 문제를 해결할 수 있도록 솔루션을 제공하기를 원한다.

당신은 그냥 수행하는 모든 단계를 설명했다