在动态创建的 HTML <a> 标记中调用 Javascript 函数不起作用

Question

这似乎是一个简单的 javascript，但我觉得问这个问题很愚蠢.. 但我不知道为什么这不起作用。我有一种方法可以在页面上动态创建一些超链接。假设超链接以 url 作为参数调用可执行文件。因此，我使用 href 调用此函数，该函数具有调用可执行文件的代码。

非动态锚标记代码可以很好地启动一个 exe。

但是，我需要它来处理动态超链接。我试图简化问题并创建以下jsFiddle 来演示该问题。该链接没有调用我的方法。我错过了什么愚蠢的东西吗？我希望它在 IE 中工作。

我已经尝试了一些人发布的一些解决方案，他们说：我应该尝试href="#" onclick="myfunc();"。不知何故，这也不起作用。

这是我的代码：

function myfunc(url){
    alert(url);
};

function dynfunc(){
    var value = "This is a link";
    var url="http://www.google.com";
    var table = $("<table id='tab1'></table>");
    var row = $("<tr></tr>");
    var valueColumn = $("<td></td>");
    $('<a href="javascript: myfunc(\'' + url + '\');"></a>').html(value).appendTo(valueColumn);

    valueColumn.appendTo(row);
    row.appendTo(table);
    $("#div1").append(table);
};

dynfunc();

Answer 1

假设你有这个 html ：

<table id="dyn">
    <tbody>
    </tbody>
</table>

您可以只将此 JavaScript 用于动态添加的<a/>，这样您就可以添加一个点击处理程序而不是几个。

<script>
    $(function() {
        var tbl = $('#dyn'), tbody = tbl.find('tbody');

        var addLink = function(url, val) { 
            var tr = $('<tr/>'),
                td = $('<td/>').appendTo(tr),
                a = $('<a/>', {href: url}).html(val).appendTo(td);
        }

        tbl.on('click', 'a', function() {
            alert($(this).attr('href'));
        });

        //some ajax that calls addLink
    });
</script>

Answer 2

DEMO HERE

更改此行：

 $('<a href="javascript: myfunc(\'' + url + '\');"></a>').html(value).appendTo(valueColumn);

收件人：

 $('<a href="#"></a>').html(value).appendTo(valueColumn).click(function(){myfunc(url) });

我们在append 之后将click 事件与您的<a> 相关联，并且每次点击都会调用myfunc(url)。