Question

晚上好！

我正在为学校作业制作一个Javascript自动生成的日历。基本创建已成功，但下一个任务是通过按“日”将日期约会添加到日历中。

这是我的问题开始的地方。我创建了一个简单的函数，并尝试将该函数作为onclick事件添加到我生成的元素中，如下面的代码所示。

问题是当我点击一个元素时，没有任何反应！我尝试使用类似警报的虚拟函数（“它工作”），但仍然没有结果。

任何人都可以帮我解决这个问题吗？

我的代码：

HTML

 <!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <script src="kalender.js"></script>
    <title>Auto-gen kalender</title>

    <style type="text/css">
        .td, tr 
        {
            border-color: red;
            border-width: 5px;
            font-family:'Bookman Old Style';
        }

        .table
        {
            background-color: grey;
            color: darkred;
        }

        .body
        {
            background-color: lightgray;
        }


    </style>
</head>
<body>
</body>
</html>

使用Javascript：

    // HOW
function MaakAfspraak() {
    alert("afspraak gemaakt");
}

function Dag_Titel(dag_naam)
{
    document.write("<td width=40>" + dag_naam + "</td>");
}

function VulTabel(maand, maand_length)
{ 
    dag = 1;
    //beginnen met tabel + berg vars, dag hieboven is belangrijk
    document.write("<table border=5 cellspacing=3 cellpadding=%3><tr>");
    document.write("<td align=center colspan=7><b>" + maand + " " + jaar + "</b><tr>");
    Dag_Titel("Zo");
    Dag_Titel("Ma");
    Dag_Titel("Di");
    Dag_Titel("Wo");
    Dag_Titel("Do");
    Dag_Titel("Vr");
    Dag_Titel("Za");

    // dit zijn de lege cellen voor het begin van een maand
    document.write("</tr><tr>")
    for (var i=1; i<start_dag; i++)
    {
        document.write("<td  onclick=´MaakAfspraak()´>");
    }

    // 1ste week van een maand
    for (var i=start_dag; i < 8; i++)
    {
        document.write("<td align=center  onclick=´MaakAfspraak()´>" + dag + "</td>");
        dag++;
    }

    document.write("<tr>");

    // rest van de weken
    while (dag <= maand_length)
    {
        for (var i = 1; i <= 7 && dag <= maand_length; i++)
        {
            document.write("<td align=center  onclick=´MaakAfspraak()´>" + dag + "</td>");
            dag++;
        }
        document.write("</tr><tr>")
        // hieronder de 1ste dag voor de volgende maand zodat we alles kunnen vullen
        start_dag = i;
    }
    document.write("</tr></table></ br>")
}

// eerste dag van nieuwe jaar en meer shiz
jaar = 2014;
vandaag = new Date("Januari 1, " + 2014)
start_dag = vandaag.getDay() + 1;  
VulTabel("Januari", 31);
VulTabel("Februari", 29);
VulTabel("Maart", 31);
VulTabel("April", 30);
VulTabel("Mei", 31);
VulTabel("Juni", 30);
VulTabel("Juli", 31);
VulTabel("Augustus", 31);
VulTabel("September", 30);
VulTabel("Oktober", 31);
VulTabel("November", 30);
VulTabel("December", 31);


//end

Answer 1

原来我的onclick函数调用使用了错误的引号。谢谢@KevinB！

Answer 2

请勿使用document.write。相反，使用DOM创建元素（速度更快），然后通过addEventListener添加事件：

//Create it
var td = document.createElement( "td" );

//Add to tr
tr.appendChild( td );

//Add event
td.addEventListener( "click", MaakAfspraak, false );

如何在Javascript中的document.write中执行onclick事件？

2 个答案: