Хорошая практика - иметь код, который требуется для всех страниц в одном файле, и иметь определенные файлы javascript для страниц, требующих определенных функций. Похоже, что вы все равно этим занимаетесь, так что у нас есть хорошая основа для дальнейшего развития.
Существует множество способов указать, какие страницы и какие файлы нужны, но помните, что в нормальных условиях файлы javascript кэшируются браузером, так что эти файлы нужно загружать только один раз.
В свете этого комментария
Да, но что, если у вас есть несколько страниц с одинаковыми элементами DOM? Например, мой плагин validator () настроен как $ ('form'). Validate (), но иногда я не хочу, чтобы он воздействовал на все формы на странице, только на некоторые из них. Что мне делать в этом случае?
Я предлагаю придумать соглашение, по которому будут отмечаться элементы, общие для всех страниц, для которых требуются определенные плагины jQuery, «прикрепленные» к ним. Например, если у вас есть элемент <form>
на нескольких разных страницах, для которых требуется плагин validator()
, но на любой конкретной странице есть более одного элемента <form>
(и не все элементы <form>
должны иметь плагин validator()
), я предлагаю с помощью класса CSS для различения <form>
элементов, которым нужен плагин.
<!-- HTML -->
<!-- need to apply plugin to this -->
<form class="validator"> ... </form>
<!-- but not to this -->
<form> ... </form>
<script type="text/javascript">
// jQuery Code (in a separate file)
$(function() {
$('form.validator').validator();
});
</script>
Таким образом, плагин будет применяться только к тем <form>
элементам, которые соответствуют селектору.
РЕДАКТИРОВАТЬ:
Я не уверен, как работают помощники в рельсах, но вы можете передавать данные в обработчик событий в jQuery, используя параметр data
в _ 10_ для любых данных, которые не являются непосредственно частью самого <a>
элемента (например, такого атрибута, как href
). Если для некоторых ссылок требуется AJAX, тогда имеет смысл пометить их классом CSS и сохранить URL-адрес в href
для элемента. Затем в вашем коде jQuery, который можно использовать на любых страницах со ссылками, которые отправляют запросы через AJAX, вы можете сделать что-то вроде
<a class="ajax-link" href="/get/someData.php">Data retrieved through AJAX</a>
<a href="/normalLink.php">Standard link with no AJAX</a>
<script type="text/javascript">
$('a.ajax-link').bind('click',ajaxRequest);
function ajaxRequest(e) {
e.preventDefault();
$.get(e.target.href, function(data) {
$('#loadDiv').html(data);
});
}
</script>
ссылка будет работать как обычная ссылка, когда у пользователя отключен JavaScript, но будет делать запрос данных AJAX, когда JavaScript включен. Я использовал здесь именованную функцию ajaxRequest
, поскольку она может упростить отладку сценария (и, возможно, также повторно использовать), но вы можете использовать анонимную функцию, если хотите.
person
Russ Cam
schedule
01.01.2010