Решение
Вот быстрое решение. Если вы заинтересованы или хотите получить больше информации о том, как заставить это работать, читайте дальше!
$('toggle').addEvent('click', function(e){
if(this.checked)) {
$$('.toggle_slide').toggle();
}
});
События
В Mootools все элементы имеют метод addEvent, который принимает два аргумента. Первый аргумент - это тип события (например, щелчок), а второй - функция, вызываемая при возникновении этого события. Эта функция имеет автоматически переданный ей аргумент, которым является само событие. Следовательно, создание нового события внутри метода addEvent является большой ошибкой, так как новое событие не будет тем же, которое вызвало функцию метода addEvent. Вы можете указать имя аргумента события по умолчанию в списке параметров функции и затем использовать его как обычно. Следовательно, в вашем коде e уже существует, так как это то, что вы назвали событием в этом фрагменте кода: function(e){ и вся строка e = new Event(e); перезаписывает этот параметр пустым событием по умолчанию. Это почти наверняка не то, что вы хотите.
Многие действия происходят, когда события происходят, даже если JavaScript отсутствует. Например, когда форма отправляется, событие submit указывает браузеру собрать данные для этой формы и отправить их в действие формы. Другой пример: когда вы нажимаете на ссылку, событие click указывает браузеру перейти по этой ссылке. Они известны как события по умолчанию. Однако, когда мы прикрепили метод addEvent, скажем, к ссылке, мы хотим, чтобы выполнялись наши собственные действия, а не браузер по умолчанию. Мы можем предотвратить эти действия по умолчанию, используя метод stop для объектов событий.
Так как e - ваш объект события, e.stop () предотвратит любые действия по умолчанию. Однако в этом случае действие по умолчанию для события щелчка на флажке состоит в том, чтобы установить или снять этот флажок. e.stop () может предотвратить это (я не проверял это), но в лучшем случае абсолютно ничего не сделает. Поэтому он либо запутает ваших пользователей, либо ничего не сделает, поэтому я предлагаю вам удалить его.
Наконец, в функции addEvent вы можете использовать ключевое слово this для ссылки на элемент, к которому прикреплено событие.
селекторы
Mootools имеет очень продвинутую систему выбора, которая позволяет вам выбирать практически все, что вы хотите. Вам нужно выбрать свой набор полей, который имеет два класса. Однако выбранный вами селектор $$('.toplined toggle_slide') говорит: «Найти элементы с выделенным классом, а затем внутри этого элемента найти элементы с тегом toggle_slide». Вместо этого вы должны использовать $$('.toggle_slide')
Элементы
Вы можете определить, установлен ли флажок в свойстве флажка. Это вернет true, если флажок установлен, и false в противном случае. В вашем случае, поскольку флажок является элементом, к которому вы добавляете событие, вы можете использовать this.checked, чтобы определить, проверено ли оно.
Совет. Если вы используете Firebug, вы можете использовать console.log для печати в консоли любого элемента. Это отобразит все свойства и методы, которыми обладает этот элемент в данный момент времени. Это откроет вам такие вещи, как проверено довольно быстро.
Кроме того, Mootools разделен на два компонента: ядро Mootools и еще Mootools. Метод переключения определяется только в Elements, если в Mootools включено Element.Shortcuts или если вы сами написали этот метод. В противном случае вы получите ошибку.