Помогите обернуть флажок переключателя onClick в функцию - PullRequest
1 голос
/ 22 апреля 2011

У меня есть страница с 50 скрытыми флажками, и я хочу иметь возможность переключать каждый флажок, нажимая на видимую ссылку.Фактические флажки должны оставаться скрытыми ... так ... Есть ли лучший способ сделать это с помощью функции JS, чтобы мне не приходилось включать полный щелчок мыши в каждой ссылке?И я использую mootools, а не jQuery.

Это работает для активации флажка:

<a href="#template-selections" onclick="javascript:check('field_select_p10');" class="add_app">Select</a>

Но для его переключения это работает:

onclick="if (event.target.tagName != 'INPUT') document.getElementById('field_select_temp_professional_10').checked = !document.getElementById('field_select_temp_professional_10').checked"

1 Ответ

1 голос
/ 22 апреля 2011

Ничто из того, что вы опубликовали, на самом деле не является кодом mootools, вы также можете не использовать mootools ...

Markup:

<a href="#template-selections" data-id="10" class="add_app">Select</a>

JS в вашем доме:

document.getElements("a.add_app").addEvents({
    click: function(e) {
        if (e.target.get("tag") != 'input') {
             var checkbox = document.id("field_select_p" + this.get("data-id"));
             checkbox.set("checked", !checkbox.get("checked"));
        }
    }
});

Если у вас есть 100+, то я предлагаю вам взглянуть на использование делегирования событий из mootools-more и добавить только одно событие в родительский объект вместо создания 100 событий и сохранения 100 функций, которые с ним работают.

Это кодирование шаблонов, и оно включает в себя изменение разметки, чтобы все заработало. Вы также можете внести изменения, основываясь на обходе DOM по отношению к нажатому элементу, например, this.getParent().getElement("input[type=checkbox]"), или что-то может означать, что вам не нужно хранить относительный идентификатор в самом элементе.

...