javascript - 动态匿名 js 函数不起作用

Question

我的问题是我正在使用 Javascript {调用函数 addInputCompField() } 向 HTML 表格动态添加一行。该行有 2 个单元格 - 第一个只是一些文本，第二个是 img 属性。问题出在 img 属性上，我还在其中添加了一个 onClick js 函数，当用户单击图像时，该函数将被调用以允许再次删除该行。onClcik js 函数未按我的预期进行评估。

这是 html 代码:-

<span class="button-gray">
    <input type="button" name="" onclick="addInputCompField();"
id="Components_Button1" value="Add a Component">           

</span>

<table id="compTableId">       
</table>

这是javscript

function addInputCompField() {
    var table = document.getElementById('compTableId');
    var rowCount = table.rows.length;
    var row = table.insertRow(rowCount);           
    var cell1 = row.insertCell(0);
    var newInput = document.createElement('input');
    newInput.type = "text";
    var rand_nr = Math.random();
    rand_nr = rand_nr * 100;
    rand_nr = Math.ceil(rand_nr);
    row.setAttribute('id','tr'+rand_nr);

    newInput.setAttribute('name', 'Comp-New'+rand_nr);
    newInput.setAttribute('size', '45');             
    cell1.appendChild(newInput);

    var cell2 = row.insertCell(1);           
    var newImg = document.createElement('img');
    newImg.setAttribute('src', '/img/remove_icon.png');
    newImg.height='16';
    newImg.width='16';

    var myOnClick = function() {removeCompField('tr'+rand_nr);};           
    newImg.onclick = function (){myOnClick;};

    cell2.appendChild(newImg);

    newInput.focus();                       
}

HTML 和 Javascript 都在同一个文件中。一切正常，除非我尝试单击带有图像的第二个单元格以删除该行。然后我收到如下浏览器错误:-

Error: syntax error
Source File:
http://localhost....
Line: 1, Column: 9
Source Code:
function () { 

我确实需要能够允许用户通过执行此 onClick 操作来删除他们刚刚添加的行。好像没有评估 javascipt 当我使用 firebug 查看图像中的内容时，这就是我所看到的:-

<img height="16" width="16" 
src="/img/remove_icon.png" onclick="function () {
    removeCompField(&quot;tr&quot; + rand_nr);
}">

我原以为不会在那里看到 rand_nr，而是一个计算值。关于如何解决这个问题的任何想法？ - 它需要同时在 Firefox 和 IE 上运行。这让我抓狂!

Answer 1

您没有执行“myOnClick”功能。

你可以执行函数:
newImg.onclick = function (){myOnClick<b>()</b>;};

或者您可以直接将处理程序与函数相关联:
newImg.onclick = myOnClick;