Использование FBJS для изменения CSS - PullRequest
Новая
       8

Использование FBJS для изменения CSS

0 голосов
/ 06 августа 2009

Я немного озадачен реализацией Javascript на Facebook. Я хочу настроить прослушиватель на флажок, чтобы при его изменении изменялся класс элемента, который я могу получить по идентификатору.

Я пользовался тестовой консолью и пробовал разные варианты. Javascript НЕ является моим первым языком, ни моим вторым, третьим ... Может кто-нибудь помочь мне с переводом моего псевдокода? 

<input class="one" type="checkbox" onclick="setcolor(this.checkedornot)">
    function setcolor(checkedornot){
        if checkedornot == true {set p.one to p.one.GREEN}
        if checkedornot == false {set p.one to p.one.RED}
    }

Очевидно, что это не javascript, но именно так я могу объяснить, какая функциональность мне нужна. В моих коротких тестах FBJS даже не регистрирует события onClick. Спасибо!

Ответы [ 3 ]

3 голосов
/ 06 августа 2009

FBJS имеет свои собственные методы получения и установки. Получение "проверено" и установка / удаление классов разные. И вам придется удалить «красный» класс, если вы добавляете «зеленый» класс, и наоборот. Или, если вы просто хотите перезаписать все классы элемента, вы можете вместо этого использовать метод setClassName (class), я собираюсь использовать методы добавления / удаления классов в своем ответе, поскольку он менее разрушителен.

Документы FBJS: манипулирование объектами

Для события onclick, я думаю, вы должны использовать addEventListener, если onclick не работает. События в FBJS

Вместо этого .checked FBJS использует getChecked. Поэтому, когда вы добавляете прослушиватель событий (для «щелчка»), добавьте «this.getChecked ()» для аргумента. 

setColor(this.getChecked());

А для функции: 

function setColor (isChecked) {
    var p = document.getElementById(ID-OF-P);
    if (isChecked) {
        p.removeClassName("red");
        p.addClassName("green");
    } else {
        p.removeClassName("green");
        p.addClassName("red");
    }
}

Я тоже новичок в JS. Я думаю это правильно.

0 голосов
/ 09 августа 2009

кмиясиро в основном прав, за исключением геттеров и сеттеров для имени класса должно быть 

  if (isChecked) {
    p.setClassName("green");
} else {
    p.setClassName("red");
}

Поскольку это всего лишь установленный метод и нет методов удаления, вам не нужно беспокоиться об удалении имени класса, оно просто будет перезаписано.

проверьте этот список для большего количества получателей и установщиков http://wiki.developers.facebook.com/index.php/FBJS#Manipulating_Objects

0 голосов
/ 06 августа 2009

Для события onclick вам нужно использовать ... 

this.checked

Тогда ваша функция будет выглядеть так: 

var setColor = function(isChecked) {
    var myElement = document.getElementById("one");
    if (isChecked) {
        myElement.className = "myGreenClass";
    } else {
        myElement.className = "myRedClass";
    }
};
...