0

我想单击一个 div 并使用 javascript 创建两个元素,然后我想单击一个新元素并更改另一个元素的类。它的大部分工作直到我想通过调用一个名为divide() buttontranslate.onclick=divide(); 的函数来更改类。

在这里,我有一个实际上不起作用的小提琴,但我相信您可以弄清楚我在说什么。我做错了吗?或者我只是错过了一个小细节?
http://jsfiddle.net/alexnode/UD6fk/16/

function myfunction(){


var tr1 = document.createElement("tr1");
var buttontranslate = document.createElement("buttontranslate");
tr1.className="trpanel";
tr1.id="trpanela";
buttontranslate.style.cssText='width:5%;height:100%;right:0px;top:0px;background:black;color:white;position:fixed;z-index:2300;cursor:pointer;'
buttontranslate.innerHTML="translate"
//buttontranslate.onclick=divide(); here is the problem


tr1.innerHTML = "Lorem ipsum dolor sit amet,";

document.body.appendChild(tr1);
document.body.appendChild(buttontranslate);



}
function divide(){ 
document.getElementById("trpanela").className = "centerpanel";
 }

编辑:这是更正的 JSfiddle,带有 Paul S http://jsfiddle.net/alexnode/UD6fk/35/的说明

4

1 回答 1

1

你不能只是编造新的元素;它不是有效的HTML
设置onclick属性时,您需要传递一个函数,而不是调用该函数。

在此处查看我对您的小提琴所做的更改

function myfunction() {
    var tr1 = document.createElement("span"), // real elements
        buttontranslate = document.createElement("button");
    tr1.className = "trpanel";
    tr1.id = "trpanela";
    buttontranslate.className = "translate";
    buttontranslate.innerHTML = "translate"
    buttontranslate.onclick = divide; // no () because we dont want to invoke
    tr1.innerHTML = "Lorem ipsum dolor sit amet, etc...";

    document.body.appendChild(tr1);
    document.body.appendChild(buttontranslate);
}

myfunction(); // invoke on page load

function divide() {
    document.getElementById("trpanela").className = "centerpanel";
}
于 2013-06-02T00:29:14.790 回答