트리거 $document.ready(수정할 수 없는 AJAX 코드가 실행됨)
저의 요건은 다음과 같습니다.
- 많은 a at a a i i i i i i a a a a a a a a i i i i 。HTML을 사용합니다.
div, AJAX 경유. - 에는 javascript취 htmlHTML)가 있습니다.
<script>...</script>) - 에는 "javascript"가 포함되어 .
$('document').ready( ... )교환 - 검색된 javascript를 수정할 수 없습니다.외부 lib에서 가져온 것입니다.
AJAX가 로드되면 호출되는 Javascript 함수가 있습니다.저는 다음과 같은 방법으로 실행하도록 '꼼수'를 부리고 있습니다.
function AjaxLoaded() { $('document').trigger('ready'); }
아쉽지만, 그건 안 되겠네요.
스택 오버플로에서 이 질문을 회피하기 위해 AJAX에서 반환되는 코드를 변경(함수로 만들고 로드 후 호출 또는 삭제)하는 응답을 여러 번 보았습니다.$(document).ready()). 이를 변경할 수 을 강조해야 합니다이 케이스에서는 취득한 코드를 변경할 수 없다는 것을 강조합니다.
연구를 좀 한 후, 나는 그것을 작동시킬 방법을 생각해냈다.
이것이 동작하는 것을 나타내는 테스트입니다.http://www.antiyes.com/test/test2.php
다음은 관련 코드입니다.
<script>
// easy copy of an array
Array.prototype.copy = function() {
return [].concat(this);
};
// this function is added to jQuery, it allows access to the readylist
// it works for jQuery 1.3.2, it might break on future versions
$.getReadyList = function() {
if(this.readyList != null)
this.myreadylist = this.readyList.copy();
return this.myreadylist;
};
$(document).ready(function() {
alert("blah");
});
</script>
<script>
// this should be added last so it gets all the ready event
$(document).ready(function() {
readylist = $.getReadyList();
});
</script>
내 몸에는 다음이 있다.
<input type="button" onclick="$(readylist).each(function(){this();});" value="trigger ready" />
기본적으로 저는 jQuery에 readyList를 클리어하기 전에 복사하는 기능을 추가했습니다.그러면 사용자가 사용할 수 있게 됩니다.
다음 코드가 작동하지 않는 것 같습니다.
function AjaxLoaded() {
$(document).trigger('ready');
}
를 document.
jQuery readyList는 버전 1.4(여기서 설명)에서 공개되지 않았기 때문에 위의 훌륭한 솔루션은 파손되어 있습니다.
이를 회피하는 방법은 원래 jQuery-ready 메서드를 덮어쓰고 자체 readyList를 작성하는 것입니다.이 작업은 원래 준비 방식을 사용하는 다른 스크립트를 로드하기 전에 수행해야 합니다.그렇지 않으면 John/Kikito와 같은 코드입니다.
// Overrides jQuery-ready and makes it triggerable with $.triggerReady
// This script needs to be included before other scripts using the jQuery-ready.
// Tested with jQuery 1.7
(function(){
var readyList = [];
// Store a reference to the original ready method.
var originalReadyMethod = jQuery.fn.ready;
// Override jQuery.fn.ready
jQuery.fn.ready = function(){
if(arguments.length && arguments.length > 0 && typeof arguments[0] === 'function') {
readyList.push(arguments[0]);
}
// Execute the original method.
originalReadyMethod.apply( this, arguments );
};
// Used to trigger all ready events
$.triggerReady = function() {
$(readyList).each(function(){this();});
};
})();
Ready 메서드를 덮어쓰는 것이 좋은지 잘 모르겠습니다.그것에 대해 자유롭게 조언해 주세요.저는 아직 부작용을 발견하지 못했습니다.
혹시나 필요할 경우를 대비해서 존의 솔루션을 조금 개선해서 javascript 파일로 직접 사용할 수 있도록 했습니다.
// jquery_trigger_ready.js
// this function is added to jQuery, it allows access to the readylist
// it works for jQuery 1.3.2, it might break on future versions
$.getReadyList = function() {
if(this.readyList != null) { this.myreadylist = [].concat(this.readyList); }
return this.myreadylist;
};
$(document).ready(function() {
readylist = $.getReadyList();
});
$.triggerReady = function() {
$(readylist).each(function(){this();});
}
한 후에 이 파일을 하면 jquery를 수 .$.triggerReady() §:
<html>
<head>
<title>trigger ready event</title>
<script src="test2_files/jquery-1.js" type="text/javascript"></script>
<script src="jquery_trigger_ready.js" type="text/javascript"></script>
</head>
<body>
<input onclick="$.triggerReady();" value="trigger ready" type="button">
<script type="text/javascript">
$(document).ready(function(){
alert("blah");
});
</script>
</body>
</html>
제가 건 런데, 는는 it by by by by by by by by by by by by by by by 。$(document).triggerReady()이에 대해 조언을 해주시면 감사하겠습니다.
우리는 같은 문제를 안고 다른 방법으로 해결했다.
대신
$(document).ready(function () {
$('.specialClass').click(....
사용방법:
$(document).bind('ready', function(event) {
$('.specialClass', event.target).click(..
jQuery는 평소처럼 문서에서 "ready" 이벤트를 트리거합니다.ajax를 통해 새 div의 내용을 로드하면 다음과 같이 쓸 수 있습니다.
loadedDiv.trigger('ready')
그리고 모든 초기화를 div에서만 수행하도록 하여 예상한 것을 얻습니다.
Simone Gianni의 답변이 가장 우아하고 깔끔하다고 생각합니다.
또, 심플화를 실시해, 한층 더 사용하기 쉽게 할 수도 있습니다.
jQuery.fn.loadExtended = function(url,completeCallback){
return this.load(url,function(responseText, textStatus, XMLHttpRequest) {
if (completeCallback !== undefined && completeCallback !== null) {
completeCallback(responseText, textStatus, XMLHttpRequest);
}
$(this).trigger("ready");
});
};
이제 다음을 사용하는 대신:
$(".container").load(url,function(responseText, textStatus, XMLHttpRequest) {
$(this).trigger("ready");
});
다음을 사용할 수 있습니다.
$(".container").loadExtended("tag_cloud.html");
또는 다음과 같이 입력합니다.
$(".container").loadExtended("tag_cloud.html",function(){
alert('callback function')
});
이 방법은 업데이트 중인 div에만 트리거를 적용할 수 있는 장점이 있습니다.
새로 로드된 HTML이 다음을 포함하는 경우<script>순수한 JS를 사용하여 메인 HTML에 삽입을 시도합니다.element.innerHTML = newHTML） 。$(document).ready신규 핸들러HTML 및 래핑된 함수는 다음과 같습니다.function() { /* some functions */ })();- 처음 트리거한 후 JQuery가 'ready' 이벤트를 바인딩 해제하고 반복 트리거할 수 없으므로 실행되지 않습니다.PS. 단,$.holdReady(true)필요할 때 트리거합니다.
그래서 jquery 메서드로 코드를 삽입해 보세요.$(element).html(newHTML)이것으로 비슷한 문제가 해결되었습니다.삽입하기 전에 jquery handle js.이 방법을 사용하면<script>(브라우저의 Elements Inspector for ex)에서).
언급URL : https://stackoverflow.com/questions/2238030/trigger-document-ready-so-ajax-code-i-cant-modify-is-executed
'programing' 카테고리의 다른 글
| $postLink 각진 컴포넌트/방향성이 너무 빨리 실행됨 (0) | 2023.03.14 |
|---|---|
| 속성별 배열 정렬 (0) | 2023.03.14 |
| Angular.js는 이전 방식으로 제출합니다. (0) | 2023.03.09 |
| react Link 컴포넌트에서 onClick 이벤트를 사용하는 방법 (0) | 2023.03.09 |
| AngularJs(1.X) 부분 템플릿 포함 (0) | 2023.03.09 |