Во-первых, приношу свои извинения всем, кто это читает. Я столкнулся с множеством проблем JS, и это самый трудноразрешимый из всех, что я когда-либо видел. Я сделаю все возможное, чтобы дать четкое описание, но мне, возможно, придется его пересмотреть.Неправильная загрузка JavaScript в firefox
У меня есть следующие загрузки страницы в встроенную рамку в SugarCRM:
<head>
<link rel="stylesheet" href="style/style.css" />
</head>
<body>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript" src="js/index_controller.js"></script>
<table class="form_text" style="width: 100%; height: 100%;" cellpadding="5">
<tr>
<td><iframe id="map_frame"
style="width: 100%; height: 100%; overflow-y: hidden; border: solid 1px #DDDDDD"
scrolling="no"
src="map.php?<?php
foreach ($_REQUEST as $key => $value) {
echo $key . "=" . $value . "&";
}?>"></iframe>
</td>
...
</td>
</tr>
</table>
</div>
<script type="text/javascript">
parent.$("iframe").each(function(iel, el) {
if(el.contentWindow === window) {
var to_remove = $(el).parent().prev();
$(to_remove).remove();
$(el).css("border", "none");
}
});
$(document).ready(function(){
updateMap();
});
</script>
</body>
И в IFRAME в этой странице, у меня есть это:
<head>
<link rel="stylesheet" href="style/style.css" />
<!--[if lte IE 8]>
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.4/leaflet.ie.css" />
<!--[endif]-->
<link rel="stylesheet"
href="http://cdn.leafletjs.com/leaflet-0.4/leaflet.css" />
<script src="js/jquery-1.9.1.js"></script>
</head>
<body>
<script type="text/javascript" src="../include/DashletContainer/Containers/DCMenu.js"> </script>
<script type="text/javascript" src="js/arrayList.js"></script>
<script type="text/javascript" src="js/custom_map_controls.js"></script>
<div id="map" style="height: 100%"></div>
<form action="../index.php" method="post" name="DetailView"
id="formDetailView">
<input type="hidden" name="module" value=""> <input type="hidden"
name="record" value=""> <input type="hidden" name="return_action"> <input
type="hidden" name="return_module"> <input type="hidden"
name="return_id"> <input type="hidden" name="module_tab"> <input
type="hidden" name="isDuplicate" value="false"> <input type="hidden"
name="offset" value="1"> <input type="hidden" name="action"
value="EditView"> <input type="hidden" name="sugar_body_only"> <input
type="hidden" name="prospect_id" value="">
</form>
<script type="text/javascript" src="js/map_icons.js"></script>
<script type="text/javascript" src="js/map_controller.js"></script>
<script src="js/leaflet-0.4.5.js"></script>
</body>
leaflet-0.4.5.js
сценарий, при оценке, создает глобально доступный объект, известный как L, который предоставляет доступ ко всем функциям карты отображения листов. В моем map_controller.js я добавляю некоторые специальные функции к L.Map, функции для создания реальных объектов карты. Это отлично работает в Chrome, и он отлично работает в Firefox, когда я загружаю страницу непосредственно на вкладке браузера. Но когда я загружаю его по назначению, на странице SugarCRM внутри встроенного фрейма, я получаю сообщение об ошибке «имя функции L.insert здесь не определено» в консоли JS. Если я обновляю только iframe без перезагрузки всей страницы SugarCRM, тогда карта появится так, как ожидалось. Теперь я обдумываю это, перехватывая исключение и заставляя страницу перезагружаться, когда это происходит, но я действительно хотел бы знать, почему это происходит в первую очередь. Я переписал контроллер карты, поэтому все функции, которые используют L, содержатся внутри функции $ (document) .ready() (используя jQuery для этого) и попытались помещать тег scriptlet в верхней части тела на странице, где он должен загружаться, и до сих пор не повезло.