Question

我四处搜寻，我找不到答案。在我的代码中，在div内部创建一个链接，并给出一个onclick值以将参数传递给函数。我无法弄清楚为什么它不会开火。

var imgCount = 0;
var curImg;


function resetImg(target) {
alert(target);
}



$(".add").click(function () {
imgCount = imgCount + 1;
curImg = "theImg" + imgCount;


//Here we add the remove link
$('#links')
    .append('<a href="#" onclick="javascript:resetImg(\'' + curImg + '\');"  class="dynamic">Call Function</a>');
$('.dynamic').css('display', 'block');
});

这是小提琴： http://jsfiddle.net/stewarjs/4UV7A/

我在创建链接时尝试使用.click（），但传递的参数需要对每个链接都是唯一的。我试过抓住$（this）.attr（“id”），但是这个值未定义。

感谢您的帮助。杰夫

Answer 1

我建议您使用已经可用的jQuery方法，而不是尝试将HTML格式化为JavaScript。

 $('#links')
    .append($("<a>").attr('href', '#').on('click', function () { resetImg(curImg);
 }).addClass('dynamic').text('Call Function'));

http://jsfiddle.net/ExplosionPIlls/4UV7A/1/

Answer 2

从onclick中删除javascript:，它应该是这样的：onclick="resetImg(\'' + curImg + '\');"

Answer 3

总有办法摆脱onclick处理程序。我就是这样做的：

var image_count = 0;

$('#links').on('click', '.dynamic', function(e) {
    e.preventDefault()

    alert($(this).data('image'));
});

$('.add').click(function () {
    $('<a />', {
        'href': '#',
        'data-image': 'theImg' + (++image_count),
        'class': 'dynamic',
        'text': 'Call function'
    }).appendTo('#links');
});

演示：http://jsfiddle.net/4UV7A/4/

.append链接不会触发onclick功能

3 个答案: