HTML <img/> onclick函数到jquery

时间:2015-06-01 11:07:07

标签: php jquery html

我有一个图像网格,它使用PHP生成HTML。每个图像都有一个onclick()函数,它在参数中有一个PHP变量。在HTML所在的页面上,我有一个Javascript函数,它使用onclick(arg)函数中的参数。

我已经开始使用jquery了,我希望能够将这个onclick()函数更改为我的jquery函数,同时使用PHP页面中的PHP参数。

这是生成HTML的PHP​​文件中的代码,正如您所看到的,有一个onclick函数,它的参数是一个数字:

Echo "<img src= '$link[Image_Link] . /133x100' id='$row[Item_Name]' title='$row[Item_Name]' class='clickableImage' alt='$just_name' onClick='addValue(". $credit_value .")' border=0 style='position: relative; top: 0; left: 0;'/>";

这是我在HTML页面上的Javascript函数,它只是更改了页面上的一些文本:

function addValue(credits){
    var value = document.getElementById("value").innerHTML;
    value = parseInt(value, 10);
    var totalValue = value+credits;
    document.getElementById("value").innerHTML = totalValue;
}

我已经为单击这些图像设置了jquery函数,但我希望能够使用PHP文件中的$credit_value变量。这是我的jquery函数的开始:

$().ready(function () {
    $('img.clickableImage').click(function () {
        if ($(this).data('selected')) { ......

3 个答案:

答案 0 :(得分:1)

您可以使用 ______________________________________ | field1 | field2 | field3 | -------------------------------------- | null | TestData | 123 | | null | TestData | 123 | | null | TestData | 123 | -------------------------------------- 前缀自定义属性,设置值

data-*

脚本,以便在您使用echo "<img data-creditvalue='. $credit_value .' ......../>";

时获取使用$.fn.data()
$(this).data('selected')

答案 1 :(得分:1)

在echo语句中,添加自定义data-*属性,如

echo "<img data-credit='". $credit_value ."' src= '$link[Image_Link] . /133x100' id='$row[Item_Name]' title='$row[Item_Name]' class='clickableImage' alt='$just_name' border=0 style='position: relative; top: 0; left: 0;'/>";

然后在您的点击处理程序中访问它

$('img.clickableImage').click(function () {
        var credit = $(this).attr('data-credit');
});

答案 2 :(得分:0)

使用活动委派

 $(document).ready(function () {
    $(document).on('click', 'img.clickableImage', function () {
            if ($(this).data('selected')) {
               // here your code
            }
    });
 });