Вынес JS код в отдельный файл. Тормозит.
Есть небольшой скрипт на сайте.
так вот я давно его писал и поэтому оно написано как попало. теперь решил привести код в порядок... Но как говорится - не ремонтируй пока работает))) рассмотрим 3 файла(упрощённая схема) index.php <!DOCTYPE html> <html> <head> <!-- Подключаем JavaScript-файл с нашим сценарием, который и будет получать данные об автомобилях --> <script src="js/custom.js"></script> <!-- Подключение скрипта PCL's Nice Tooltip --> <script type="text/javascript" src="js/pcl_tooltip.js"></script> </head> <!-- при загрузке боди, подключается скрипт. может влияет. решил указать--> <body onload="PCL_TooltipInit();"> <div id="form"> <form id="searchFormx"> <div id="marki"> <select id="select_marka"> <option value="">Выберите марку</option> <?php foreach($marki as $marka): ?> <option value="<?php echo $marka['marka_id'];?>"><?php echo $marka['marka_name'];?></option> <?php endforeach; ?> </select> </div> <div id="modele"> </div> <div id="cars"></div> </form> <div id="info"></div> <div style=" width:100%; height:1px; clear:both;"></div> </div> <div id="msg"></div> <div id="search-result"></div> </body> </html> search.php <?php if(isset($_POST['marka_id']) && $_POST['marka_id'] != ""): ?> <?php $marka_id = $_POST['marka_id']; $modele = getModel($marka_id); ?> <select id="select_model"> <option value="">Выберите модель</option> <?php foreach($modele as $model): ?> <option value="<?php echo $model['model_id'];?>"><?php echo $model['model_name'];?></option> <?php endforeach; ?> </select> <?php endif; ?> <?php if(isset($_POST['model_id']) && $_POST['model_id'] != ""): ?> <?php $model_id = $_POST['model_id']; $cars = getCars($model_id); ?> <select id="select_car"> <option value="">Выберите модификацию</option> <?php foreach($cars as $car): ?> <option value="<?php echo $car['car_id'];?>"><?php echo $car['car_name'];?></option> <?php endforeach; ?> </select> <?php endif; ?> <!-- не видит скрипт по относительному пути, пришлось абсолютный писать, и добавление async не помогло--> <script src="абсолютный путь к файлу/custom.js" async></script> custom.js
$(document).ready(function(){
$('#select_marka').change(function(){
$.post(
'php/search.php',
{ marka_id:$('#select_marka').val()},
function(res){
$('#modele').html(res);
$('#search-result').empty();
$('#msg').empty();
$('#cars').empty();
$('#searchForm').trigger( 'reset' );
}
)
});
$('#select_model').change(function(){
$.post(
'php/search.php',
{ model_id:$('#select_model').val()},
function(res){
$('#cars').html(res);
$('#search-result').empty();
$('#msg').empty();
}
)
});
$('#select_car').change(function(){
$.post(
'php/search.php',
{ car_id:$('#select_car').val()},
function(res){
$('#info').html(res);
PCL_TooltipUpdate();
$('#search-result').empty();
$('#msg').empty();
}
)
});
});
Вот так всё начинает дико тормозить при уже 3-4 обращении, потом вообще список перестаёт подгружаться. Так как будто память забивается. если вынести часть JS кода непосредственно в файл search.php и отключить файлик js из search.php
<script>$('#select_model').change(function(){
$.post(
'php/search.php',
{ model_id:$('#select_model').val()},
function(res){
$('#cars').html(res);
$('#search-result').empty();
$('#msg').empty();
}
)
});
</script>
<script>
$('#select_car').change(function(){
$.post(
'php/search.php',
{ car_id:$('#select_car').val()},
function(res){
$('#info').html(res);
PCL_TooltipUpdate();
$('#search-result').empty();
$('#msg').empty();
}
)
});
});
</script>
а первая часть остаётся подключена в index.php через файл js. всё работает без тормозов. В чём дело, подскажите? как я вижу проблемы выполнения кода в файле search.php... но почему? P.S. Мне тут подсказывают что это не JS a jQuery))) Да. извините. Не обратил внимание. |
ок... это jQuery
но сути это не меняет. Библиотека подключена в файле index.php |
Цитата:
У вас файл custom.js, возможно, подключается к странице каждый раз, как запрос к файлу search.php отправляется. Перенесите custom.js в индекс, а обработчики событий вешайте на document.body. Думаю это поможет. |
Цитата:
|
Цитата:
первая часть custom.js срабатывает отлично, и данные обрабатываются нормально, список моделей заполняется, а дальше не идёт.
$('#select_model').change(function(){
$.post(
'php/search.php',
{ model_id:$('#select_model').val()},
function(res){
$('#cars').html(res);
$('#search-result').empty();
$('#msg').empty();
}
)
});
$('#select_car').change(function(){
$.post(
'php/search.php',
{ car_id:$('#select_car').val()},
function(res){
$('#info').html(res);
PCL_TooltipUpdate();
$('#search-result').empty();
$('#msg').empty();
}
)
});
эта часть не работает |
вместо
$('#select_model').change(function(){
написал
$('#cars').on('change', '#select_model', function(){
не работает вообщеесли пишу так
$(document).on('change', '#select_model', function(){
начинает тормозить(также как и при подключении файла скрипта к search.php) |
Цитата:
|
Цитата:
дайте пример пожалуйста что вы имеете ввиду. как не надо сделать. |
сделал во всех трёх случаях
$(document).on('change',
теперь работает без тормозов и видит прекрасно без непосредственного подключения в файл search.php
$(document).ready(function(){
$(document).on('change', '#select_marka', function(){
$.post(
'php/search.php',
{ marka_id:$('#select_marka').val()},
function(res){
$('#modele').html(res);
$('#search-result').empty();
$('#msg').empty();
$('#cars').empty();
$('#searchForm').trigger( 'reset' );
}
)
});
$(document).on('change', '#select_model', function(){
$.post(
'php/search.php',
{ model_id:$('#select_model').val()},
function(res){
$('#cars').html(res);
$('#search-result').empty();
$('#msg').empty();
}
)
});
$(document).on('change', '#select_car', function(){
$.post(
'php/search.php',
{ car_id:$('#select_car').val()},
function(res){
$('#info').html(res);
PCL_TooltipUpdate();
$('#search-result').empty();
$('#msg').empty();
}
)
});
});
правильно сделал? или плохо будет работать? помогите упростить код с помощь switch |
Цитата:
Ваши списки должны быть зависимы? |
| Часовой пояс GMT +3, время: 03:33. |