Question

在JavaScript中，我使用click事件来更改图表数据。以下是点击事件的方法。

$('#pro1').click(function () {
            chart.series[0].update({
                data: pro1
            });
        });
        $('#pro2').click(function () {
            chart.series[0].update({
                data: pro2
            });
        });
        $('#pro3').click(function () {
            chart.series[0].update({
                data: pro3
            });
        });

我需要在一个事件中缩小这三个单击事件，这意味着我想编写一个处理id的click事件。有点像下面的代码。

$('#pro'+i).click(function () {
chart.series[0].update({
     data: pro+i
});
});

我不知道该怎么做。上面的代码不正确，只是我对JavaScript缺乏了解。

Answer 1

试试这个：

var that = this;
$('#pro1,#pro2,#pro3').click(function () {
    chart.series[0].update({
        data: that[$(this).attr('id')];
    });
});

Answer 2

我建议创建一个对象并使用类选择元素，clicked元素的id检索辅助对象的相应属性的值：

var pros = {
   pro1: '...',
   pro2: '...'
};

$('.pros').click(function () {
    chart.series[0].update({
        data: pros[this.id]
    });
});

Answer 3

$('#pro1,#pro2,#pro3').click(function () {
    chart.series[0].update({
        data: $(this).attr('id');
    });
});

更新了代码

$('#pro1,#pro2,#pro3').click(function () {
    chart.series[0].update({
        data: window[this.id]
    });
});

Answer 4

使用课程。

$('.pro').click(function () {
 chart.series[0].update({
   data: $(this).attr('id');
 });
});

然后在每个＃pro1，＃pro2，＃pro3元素上添加一个＆＃39; pro＆＃39;

Answer 5

$("*[id^=pro]").click(function () {
    chart.series[0].update({
         data: $(this).attr('id');
    });
});

Answer 6

您可以为所有元素提供类名，并在jQuery中使用：eq（）选择器。

Answer 7

使用每个function（）即可做到

var i =0;
$("#pro"+i+", #pro"+i+", #pro"+i+"").each(function(){
            $(this).on('click', function(){
chart.series[0].update({
     data: pro+i
});

});});

单个JavaScript单击事件中的多个ID

7 个答案: