0

我需要帮助来压缩我的脚本，以便 #div_x 与单独的元素 img_x 相关。

我的项目使用 ui-selectable 来抓取地图上的点并通过 jquery 循环在单独的 div 中返回图像集（如此处http://bit.ly/gH7Lm3）。

我已将“selectablestop”事件绑定到两个函数 - .hasClass 和 .append - 以便 1）检测是否已选择一个点，以及 2）将包含的循环 div 附加到相应的图像（顺便说一下，包含在它的自己的div）。照原样，它看起来像这样：

$("#selectable").selectable().bind("selectablestop", function(event, ui) {
if($('#point_a').hasClass('ui-selected')){
$('#cycle').append('<div id="pic"><img src="image_a.jpg" /></div>');}

if($('#point_b').hasClass('ui-selected')){
$('#cycle').append('<div id="pic"><img src="image_b.jpg" /></div>');}

if($('#point_c').hasClass('ui-selected')){
$('#cycle').append('<div id="pic"><img src="image_c.jpg" /></div>');}

， ETC。

我的问题：

我可以用一个参数来完成这个吗，使用变量 x 而不是写出匹配 point_a 到 img_a、point_b 到 img_b 等的每一行。也就是说，

if($('#point_(variable)').hasClass('ui-selected')){
$('#cycle').append('<div id="pic"><img src="image_(matching variable).jpg" /></div>');}

谢谢！我花了一些时间寻找一个好的方法。

4

1 回答 1

0

感谢 rdworth 通过 Jquery 论坛提供此解决方案：

<li id="point_a" data-image="image_a.jpg">...</li>
<li id="point_b" data-image="image_b.jpg">...</li>


$( ".ui-selected" ).each(function() {
  $( "#cycle" ).append( "<div id='pic'><img src='" + $( this ).data( "image" ) + "'></div>" );
});
于 2011-03-31T20:04:24.590 回答