未定义Onclick函数

Question

我有一张桌子，可让我单击一个项目并更改值。 为了针对较旧的浏览器（IE8）进行优化，我将表格的绘制方式从每次附加<td>元素改为串联字符串，然后一次附加所有项目。 但是在我的新字符串中，附加函数没有被调用。

这是我工作的代码片段：

             $('<td>', {
                 'text': value,
                 'class': 'editableCell',
                 'data-hd': currentCell.hd,
                 'data-cl': currentCell.cl,
                 'click': editFunction
            }).appendTo(tr_body);

我将其更改为：

tableString += '<td class="selectable" data-hd="' + currentCell.hd+ '" data-cl="' + currentCell.cl+ '" onclick="editFunction()">' + value + '</td>';

现在，当我单击该元素时，我得到了Uncaught ReferenceError: blurEdit is not defined

任何想法都与第一次click: editFunction之间有什么区别click: editFunction和第二个onclick='editFunction()'吗？

该函数是：

 var editFunction= function () {
     $(this).off();
     var value = $(this).text();
     var inp = $('<input>', {
         'type': 'text',
         'value': value,
         'class': 'form-control',
         'blur': blurEdit
     });
     $(this).html(inp);
     inp.focus();
 };

所以它走得太远了，然后失败了，而blurEdit函数没有改变。

Answer 1

您是否知道第一次单击之间的区别：editFunction和第二次onclick ='editFunction（）'？

一个将对函数的引用（从当前作用域链中）分配给事件处理程序。

另一个函数创建一个新函数，该函数尝试通过名称在不同的作用域链（内在事件处理程序作用域，类似于“ onclick函数本身，元素对象的属性，窗口”之类）中访问上述函数。

回到第一种方法。 这比尝试通过将字符串粉碎在一起来创建HTML更加安全，更加安全。