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

在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

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

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

Answer 2

试试这个：

 var that = this; $('#pro1,#pro2,#pro3').click(function () { chart.series[0].update({ data: that[$(this).attr('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元素上添加一类’pro’

Answer 5

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

Answer 6

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