У меня есть функция, определенная в моем нижнем колонтитуле, которая загружается для всех страниц моего сайта. Он содержит в основном общие сценарии и функции. Функция выглядит следующим образом:
function replaceOrderRow (accession) {
$.ajax({
url: '/Orders/order_row_getByAccession',
type: 'POST',
dataType: 'json',
data: {"data-accession": accession},
complete: function(xhr, textStatus) {
},
success: function(data, textStatus, xhr) {
$("[data-accession=" + accession + "].worklist").replaceWith(data.markup);
colorrows ($('#patientdiv .worklist, #orderswrapper .worklist'));
},
error: function(xhr, textStatus, errorThrown) {
}
});
}
Это прекрасно работает, когда вызывается другим скриптом / функцией, которая также определена на странице нижнего колонтитула.
Затем я также загружаю некоторый контент через AJAX динамически в div, который имеет в основном разметку HTML, но также содержит несколько сценариев, определяющих c для этого содержимого. Большинство этих сценариев загружаются и работают нормально, но когда я пытаюсь вызвать функцию replaceOrderRow из функции, определенной в динамически загружаемом содержимом, я получаю сообщение об ошибке «ReferenceError: replaceOrderRow is notfined» в консоли. Вероятно, не очень хорошая практика динамически загружать сценарии с помощью AJAX.
Функция на динамически загружаемой странице вызывает вызов AJAX, и проблема в успешном выполнении / выполнении (я изменился на. сделано / .fail / .always для большинства других моих звонков). Этот старше, но не должен иметь значения. Проблема возникает после того, как $ ('# closeorderoverlay'). On ('click', function (e) ...), и я не удивлюсь, если вызов getOrderCount (терпеливая) также не будет работать, хотя скрипт выдает ошибки до того, как он туда попадет.
$.ajax({
url: '/ManagePatients/orderform',
type: 'POST',
dataType: 'html',
data: extradata,
complete: function(xhr, textStatus) {
},
success: function(data, textStatus, xhr) {
$('#modalDiv').html(data);
$('#modalDiv').show();
$("html, body").animate({ scrollTop: 0 }, "slow");
$("body").css("overflow", "hidden");
$('#closeorderoverlay').on('click', function(e) {
if (accession != undefined) {
replaceOrderRow(accession);
}
if($("#orderswrapper").length == 0) { // on the patients page
patientrow = $("#patientswrapper").find("[data-mrn='" + mrn + "']");
patientrow.find(".showorders").trigger("click");
getOrderCount(patientrow);
}
$('#modalDiv').html("");
$("body").css("overflow", "auto");
$('#modalDiv').hide();
$("html, body").animate({scrollTop: 0}, 500);
});
. . . . .
. . . . .
Я немного переместил функции, и когда я перемещаю функцию на загруженной странице AJAX в нижний колонтитул, в некоторых местах он не работает, а в другие, кажется, теперь работают. Он не находится в блоке, готовом к документу, а просто обернул его тегами. Похоже, что порядок загрузки имеет значение, хотя я не совсем понимаю, в чем проблема. Скорее, он будет по-прежнему на загруженной странице AJAX, поскольку он действительно нужен только для содержимого, содержащегося на этой странице.
Спасибо.