jQuery在另一个on事件中插入元素

Question

首先在这里发布，并且在javascript / jquery / webstuff上还很新，但是即使在对我要做的事情进行了一些研究之后，我也没有设法找到使该事情起作用的东西。

因此，这是上下文：
我正在使用HTML和Javascript / Jquery创建时间表。

我希望能够通过单击当天（这是<td> ）直接注入自动生成的<span>或其他内容。

最初，我使用了诸如“ getElementById（）”之类的基本东西，但是如果我设法做到这一点，我将进行大量重复的代码。 而且我很确定我可以避免这种情况。

所以基本上我想做通用代码并能够获得用户点击的代码。

这是我现在设法完成的操作：HTML part：

<table>
    <tr>
        <th class="day-name">Sun</th>
        <th class="day-name">Mon</th>
        <th class="day-name">Tue</th>
        <th class="day-name">Wed</th>
        <th class="day-name">Thu</th>
        <th class="day-name">Fri</th>
        <th class="day-name">Sat</th>
    </tr>

    {% set counter = namespace(a=0) %}
    {% for x in range(0, 5) %}
        <tr class="week">
            {% for y in range(0, 7) %}
                {% set counter.a = counter.a + 1 %}
                <!-- <td id="2" class="day" onclick="addEvent()"><span class="number">{{ counter.a }}</span></td> -->
                <td id="day_{{ counter.a }}" class="day"><span class="number">{{ counter.a }}</span></td>
            {% endfor %}
    {% endfor %}
</table>

Javascript部分：

function addEvent(){
    var node = document.createElement("span");
    node.setAttribute("class", "event");
    document.getElementById("2").appendChild(node);
};

$(document).ready(function(){
    $("td").click(function(){
        alert("Ahahahah");
        var node = document.createElement("span");
        node.setAttribute("class", "event");
        document.getElementById(this).appendChild(node);
    });
});

{％...％}来自Flask / Jinja的东西，但是我很确定那不是问题。

该脚本在另一个文件中，但包含该文件。 （可以肯定，因为脚本“ addEvent”运行良好）。

因此，我尝试了很多很多事情，但仍然无法正常工作。 警报弹出窗口甚至没有显示出来，因此我无法尝试该脚本。 我猜想注入新元素的方法是错误的，但是我一直没有找到想要的方法。

在这里，在此先感谢您抽出宝贵的时间来帮助我

Answer 1

我懂了

onclick="addingEvent()" 

但

function addEvent(){

马贝这是问题吗？

Answer 2

您需要使用this的引用，并使用this可以附加它。

 $(document).ready(function(){ $("td").click(function(){ alert("Ahahahah"); var node = document.createElement("span"); node.setAttribute("class", "event"); this.appendChild(node); }); });