javascript - 单击 amx 中的按钮时更改整个背景颜色

Question

在 AMX 页面中，我有 2 个命令按钮。如果我单击第一个命令按钮，我想更改整个页面的背景颜色。如果我单击第二个，想要应用其他不同的背景颜色。我正在尝试插入 javascript 来执行此操作。但它不起作用。请帮助我我该怎么做？

<?xml version="1.0" encoding="UTF-8" ?>
<amx:view xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:amx="http://xmlns.oracle.com/adf/mf/amx"
          xmlns:dvtm="http://xmlns.oracle.com/adf/mf/amx/dvt">
    <amx:panelPage id="pp1">
        <amx:facet name="header">
            <amx:outputText value="Home" id="ot1"/>
        </amx:facet>
         <amx:commandButton text="Red" id="red" styleClass="blue-background">
            <amx:validationBehavior id="abc"/>
        </amx:commandButton>
        <amx:outputText value="Color" id="color"/>        
        <amx:commandButton text="Green" id="green" styleClass="green-background"/>       
    </amx:panelPage>
</amx:view>

上面的代码是我的AMX页面代码。我的 JavaScript 代码是，

$(function(){
     $("#red").on("click", function(){
        alert("clicked");        
     });
         $("#green").on("click", function(){
        alert("clicked second....");         
     });
});

Answer 1

我不知道 AMX，但这就是我们在 javascript 中的做法:

document.getElementById('green').onclick=function(){
            document.body.style.background='green';
                }
document.getElementById('red').onclick=function(){
        document.body.style.background='red';
    }