Question

我有一些路径设置为变量

var imagepath = "../Resources/Images/teamLogo1.png";

现在点击图片我必须将其作为onclick函数中的参数传递

请查看fiddle here

我附加图片，我需要在那里写onclick功能编辑：包括完整代码

$(document).ready(function(){
var imagepath = "../Resources/Images/teamLogo1.png";
    $("#Testing").append('<img src="http://www.magerempowerment.com/v2/blog/wp-content/uploads/2012/07/doubt_dice.jpg" onClick="testfunction('+ imagepath + ')">');

});

function testfunction(imagepath){
alert(imagepath);
};

Answer 1

由于该值是字符串，因此您需要将其与''

括起来

$(document).ready(function () {
    var imagepath = "../Resources/Images/teamLogo1.png";
    $("#Testing").append('<img src="http://www.magerempowerment.com/v2/blog/wp-content/uploads/2012/07/doubt_dice.jpg" onClick="testfunction(\'' + imagepath + '\')">');

});

function testfunction(imagepath) {
    alert(imagepath);
};

演示：Fiddle

Answer 2

使用.prop

$('img').click(function(){
   alert($(this).prop('src')); 
});

Answer 3

您的功能无法调用，因为您正在创建img dynamically，请尝试使用

<强> HTML

$("#Testing").append('<img src="http://../doubt_dice.jpg" data-path="'+imagepath+'">');

<强> SCRIPT

$(document).on('click','img',function(){
    console.log($(this));
    alert($(this).data('path'));
});

Fiddle

Answer 4

根本不要在HTML代码中嵌入处理程序。

$(document).ready(function(){
    var imagepath = "../Resources/Images/teamLogo1.png",
        img = $('<img src="http://.../doubt_dice.jpg">');
    img.click(function () {
        // you can refer to imagepath here, for example
        $(this).prop('src', imagepath);

        // or call your function:
        testfunction.call(this, imagepath);
    });
    img.appendTo("#Testing");
});

但请注意，相对路径（"../Resources/Images/teamLogo1.png"）始终相对于HTML文档。

如何在javascript onclick函数中使用/作为参数传递变量

4 个答案: