Сегодня я потратил много времени на настройку локального тестового сервера, и после попытки установить кучу всего вручную я, наконец, решил просто использовать WampServer, и это здорово.
После тестирования моего сайта я был очень рад видеть, что весь PHP работает безупречно, но я заметил, что некоторые из javascript не работают, а некоторые изображения не загружаются.
Все пути относительные — пути к изображениям в css выглядят так: url(img/btn_bg.png)
. Некоторые из них отображаются, некоторые нет, хотя все они локально находятся в одном месте, и я могу получить к ним доступ через веб-браузер, если вручную наберу путь/имя файла. Все они появляются на удаленном сайте. Я проверил, чтобы пути не зависели от удаленного сайта (не абсолютные пути).
Я не совсем уверен, как проверить, что происходит с JavaScript. У меня есть firebug, но я не знаю, как использовать функции отладки. Я пробовал тестировать заглушки с помощью предупреждений, но безуспешно. Поскольку весь код JS находится в одном файле, он правильно работает на удаленном сервере, а НЕКОТОРЫЕ из них работают правильно локально, я не уверен, что с ним может происходить? Опять же, пути все относительные.
Поскольку этот проект является частным, мне не разрешено раскрывать большую часть кода, но вот несколько примеров:
function changeDiv()
{
var direction = arguments[0];
var tabs = new Array(
'basics', 'operations', 'info', 'contractinfo', 'contractsize',
'intent_tab', 'transportation', 'type', 'mep', 'materials',
'clinicalresearch', 'consulting', 'collaboration', 'construction',
'education', 'environmental', 'vendor', 'realestate', 'recs', 'fin');
var vis = new Array();
for ( a = 0; a < tabs.length; ++a )
{
var temp = tabs[a];
if (document.getElementById(temp).className.match('show'))
{
vis += tabs[a];
}
}
if (
vis == 'basics' || vis == 'operations' || vis == 'info' ||
vis == 'contractinfo' || vis == 'contractsize' || vis == 'intent_tab' ||
vis == 'transportation' || vis == 'materials' || vis == 'recs' ||
vis == 'fin' )
{
switch (vis)
{
case 'basics':
document.getElementById('operations').className =
document.getElementById('operations').className.
replace(/\bhide\b/, 'show');
document.getElementById('basics').className =
document.getElementById('basics').className.
replace(/\bshow\b/, 'hide');
document.getElementById('back_button').className =
document.getElementById('back_button').className.
replace(/\bhide\b/, 'show');
break;
case 'operations':
if (direction == 'next')
{
document.getElementById('info').className =
document.getElementById('info').className.
replace(/\bhide\b/, 'show');
document.getElementById('operations').className =
document.getElementById('operations').className.
replace(/\bshow\b/, 'hide');
}
else
{
document.getElementById('basics').className =
document.getElementById('basics').className.
replace(/\bhide\b/, 'show');
document.getElementById('operations').className =
document.getElementById('operations').className.
replace(/\bshow\b/, 'hide');
document.getElementById('back_button').className =
document.getElementById('back_button').className.
replace(/\bshow\b/, 'hide');
}
break;
case 'info':
if (direction == 'next')
{
document.getElementById('contractinfo').className =
document.getElementById('contractinfo').className.
replace(/\bhide\b/, 'show');
document.getElementById('info').className =
document.getElementById('info').className.
replace(/\bshow\b/, 'hide');
}
else
{
document.getElementById('operations').className =
document.getElementById('operations').className.
replace(/\bhide\b/, 'show');
document.getElementById('info').className =
document.getElementById('info').className.
replace(/\bshow\b/, 'hide');
}
break;
case 'contractinfo':
if (direction == 'next')
{
document.getElementById('contractsize').className =
document.getElementById('contractsize').className.
replace(/\bhide\b/, 'show');
document.getElementById('contractinfo').className =
document.getElementById('operations').className.
replace(/\bshow\b/, 'hide');
}
else
{
document.getElementById('info').className =
document.getElementById('info').className.
replace(/\bhide\b/, 'show');
document.getElementById('contractinfo').className =
document.getElementById('contractinfo').className.
replace(/\bshow\b/, 'hide');
}
break;
case 'contractsize':
if (direction == 'next')
{
document.getElementById('intent_tab').className =
document.getElementById('intent_tab').className.
replace(/\bhide\b/, 'show');
document.getElementById('contractsize').className =
document.getElementById('contractsize').className.
replace(/\bshow\b/, 'hide');
}
else
{
document.getElementById('contractinfo').className =
document.getElementById('contractinfo').className.
replace(/\bhide\b/, 'show');
document.getElementById('contractsize').className =
document.getElementById('contractsize').className.
replace(/\bshow\b/, 'hide');
}
break;
case 'intent_tab':
if (direction == 'next')
{
document.getElementById('transportation').className =
document.getElementById('transportation').className.
replace(/\bhide\b/, 'show');
document.getElementById('intent_tab').className =
document.getElementById('intent_tab').className.
replace(/\bshow\b/, 'hide');
}
else
{
document.getElementById('contractsize').className =
document.getElementById('contractsize').className.
replace(/\bhide\b/, 'show');
document.getElementById('intent_tab').className =
document.getElementById('intent_tab').className.
replace(/\bshow\b/, 'hide');
}
break;
case 'transportation':
if (direction == 'next')
{
document.getElementById('materials').className =
document.getElementById('materials').className.
replace(/\bhide\b/, 'show');
document.getElementById('transportation').className =
document.getElementById('transportation').className.
replace(/\bshow\b/, 'hide');
}
else
{
document.getElementById('intent_tab').className =
document.getElementById('intent_tab').className.
replace(/\bhide\b/, 'show');
document.getElementById('transportation').className =
document.getElementById('transportation').className.
replace(/\bshow\b/, 'hide');
}
break;
case 'materials':
if (direction == 'next')
{
document.getElementById('type').className =
document.getElementById('type').className.
replace(/\bhide\b/, 'show');
document.getElementById('materials').className =
document.getElementById('materials').className.
replace(/\bshow\b/, 'hide');
}
else
{
document.getElementById('transportation').className =
document.getElementById('intent_tab').className.
replace(/\bhide\b/, 'show');
document.getElementById('materials').className =
document.getElementById('materials').className.
replace(/\bshow\b/, 'hide');
}
break;
case 'recs':
if (direction == 'next')
{
document.getElementById('fin').className =
document.getElementById('fin').className.
replace(/\bhide\b/, 'show');
document.getElementById('recs').className =
document.getElementById('recs').className.
replace(/\bshow\b/, 'hide');
}
else
{
document.getElementById('type').className =
document.getElementById('type').className.
replace(/\bhide\b/, 'show');
document.getElementById('recs').className =
document.getElementById('recs').className.
replace(/\bshow\b/, 'hide');
}
break;
case 'fin':
if (direction == 'back')
{
document.getElementById('recs').className =
document.getElementById('recs').className.
replace(/\bhide\b/, 'show');
document.getElementById('fin').className =
document.getElementById('fin').className.
replace(/\bshow\b/, 'hide');
}
break;
}
}
else
{
if (vis == 'type')
{
if (direction == 'next')
{
logic('q_16');
document.getElementById('type').className =
document.getElementById('type').className.
replace(/\bshow\b/, 'hide');
}
else
{
document.getElementById('transportation').className =
document.getElementById('transportation').className.
replace(/\bhide\b/, 'show');
document.getElementById('type').className =
document.getElementById('type').className.
replace(/\bshow\b/, 'hide');
}
}
else if ( vis != 'type')
{
if (vis == 'recs' && direction == 'next')
{
document.getElementById('fin').className =
document.getElementById('fin').className.
replacec(/\bhide\b/, 'show');
document.getElementById('recs').className =
document.getElementById('recs').className.
replace(/\bshow\b/, 'hide');
document.getElementById('calc_risk').className =
document.getElementById('calc_risk').className.
replace(/\bshow\b/, 'hide');
document.getElementById('recs_header').className =
document.getElementById('recs_header').className.
replace(/\bhide\b/, 'show');
}
else if (vis == 'recs' && direction == 'back')
{
document.getElementById('type').className =
document.getElementById('type').className.
replace(/\bhide\b/, 'show');
document.getElementById('recs').className =
document.getElementById('recs').className.
replace(/\bshow\b/, 'hide');
document.getElementById('calc_risk').className =
document.getElementById('calc_risk').className.
replace(/\bhide\b/, 'show');
document.getElementById('recs_header').className =
document.getElementById('recs_header').className.
replace(/\bshow\b/, 'hide');
}
else if (direction == 'next')
{
var tab_array = new Array('mep', 'realestate', 'vendor', 'environmental', 'education', 'construction', 'collaboration', 'consulting', 'clinicalresearch');
var visTab = document.getElementById('vis_tab').value;
for (x = 0; x < tab_array.length; ++x)
{
var temp_tab = tab_array[x];
document.getElementById(temp_tab).className =
document.getElementById(temp_tab).className.
replace(/\bshow\b/, 'hide');
}
switch(visTab)
{
case 'mep':
wholesale();
break;
case 'realestate':
realestate();
break;
case 'vendor':
vendor();
break;
case 'environmental':
environment();
break;
case 'education':
education();
break;
case 'construction':
construction();
break;
case 'collaboration':
collaboration();
break;
case 'consulting':
consulting();
break;
case 'clinicalresearch':
clinicalresearch();
break;
}
document.getElementById('recs').className =
document.getElementById('recs').className.
replace(/\bhide\b/, 'show');
document.getElementById('calc_risk').className =
document.getElementById('calc_risk').className.
replace(/\bshow\b/, 'hide');
document.getElementById('recs_header').className =
document.getElementById('recs_header').className.
replace(/\bhide\b/, 'show');
recsPage();
}
}
else
{
document.getElementById('type').className =
document.getElementById('type').className.
replace(/\bhide\b/, 'show');
//materials realestate vendor environmental education construction collaboration consulting clinicalresearch
var b_vis = new Array('mep', 'realestate', 'vendor', 'environmental', 'education', 'construction', 'collaboration', 'consulting', 'clinicalresearch');
for (x = 0; x < b_vis.length; ++x)
{
var temp_vis = b_vis[x];
document.getElementById(temp_vis).className =
document.getElementById(temp_vis).className.
replace(/\bshow\b/, 'hide');
}
}
}
}
Приведенный выше код будет работать для переключения между различными div, по большей части, но этот конкретный раздел не работает полностью:
document.getElementById('recs').className =
document.getElementById('recs').className.
replace(/\bhide\b/, 'show');
document.getElementById('calc_risk').className =
document.getElementById('calc_risk').className.
replace(/\bshow\b/, 'hide');
document.getElementById('recs_header').className =
document.getElementById('recs_header').className.
replace(/\bhide\b/, 'show');
recsPage();
recsPage();
никогда не вызывается на локальном хосте. Удаленно работает нормально. Код идентичен между ними. Есть и другие разделы, которые не работают, но сейчас меня беспокоит только один.
Любые идеи? Поскольку javascript выполняется на стороне клиента, я не могу понять, почему он не работает, если он не на удаленном сервере.
<base href>
, который указывает на место, где, возможно, находится другая версия javascript? Как насчет отладки, чтобы увидеть, выполняются ли функции с помощью такого инструмента, как Firebug, или просто помещаяalert('In function: <functionname>')
в начало функций, которые, как вы подозреваете, ведут себя неправильно? - person CodeCaster   schedule 15.09.2011.replace(/\bhide\b/, 'show');
Какое значение className до и что вы хотите после. Пример пожалуйста. - person Andrew D.   schedule 15.09.2011document.getElementById
, вы можете закешировать их в переменную и избежать повторений. - person Igor Zinov'yev   schedule 15.09.2011url(/img/btn_bg.png)
. Если относительно страницы, то папкаimg
должна быть размещена на том же уровне, что и страница. - person Andrew D.   schedule 16.09.2011document.getElementById('recs_header').className = ...
. Вы можете создать переменную для каждого идентификатора элемента, который вы запрашиваете таким образом, чтобы вы могли повторно использовать их следующим образом:var recs_header = document.getElementById('recs_header');
, а затем:recs_header.className = recs_header.className.replace('hide', 'show');
- person Igor Zinov'yev   schedule 16.09.2011var recs_header
(обратите внимание на ключевое словоvar
) внутри функции, она будет видна в любом месте внутри этой функции и всех функций, определенных внутри нее. Если вам интересно, я предлагаю вам проверить эту ветку вопросов: stackoverflow.com/questions/111102/ - person Igor Zinov'yev   schedule 19.09.2011