使用FBJS更改CSS

时间:2009-08-06 06:35:48

标签: javascript css facebook fbjs

我对Javascript的Facebook实施感到有些困惑。我想在一个复选框上设置一个监听器,这样当检查时,它会改变我可以通过ID获得的元素的类。

我一直在使用测试控制台并尝试了各种排列。 Javascript不是我的第一语言,也不是我的第二语言,第三语... COuld有人通过翻译我的伪代码来帮助我吗?

<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 个答案:

答案 0 :(得分:3)

FBJS拥有自己的吸气剂和制定者。获得“检查”和设置/删除类是不同的。而且,如果要添加“绿色”类,则必须删除“红色”类,反之亦然。或者,如果你只想覆盖元素的所有类,你可以使用setClassName(class)方法,我将在我的答案中使用add / remove类方法,因为它的破坏性较小。

FBJS Docs: Manipulating Objects

对于onclick事件,我认为如果onclick不起作用,你应该使用addEventListener。 Events in FBJS

而不是this.checked,FBJS使用getChecked。因此,当您添加事件侦听器(用于“单击”)时,为arg添加“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新手。我认为这是对的。

答案 1 :(得分:0)

对于onclick事件,您需要使用...

this.checked

然后你的功能将如下所示:

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

答案 2 :(得分:0)

kmiyashiro大部分是正确的,除了类名的getter和setter 它应该是

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

由于它只是一个集合方法而且没有删除方法,所以你不必担心删除类名,它只会被覆盖。

查看此列表以获取更多getter和setter http://wiki.developers.facebook.com/index.php/FBJS#Manipulating_Objects