Соответствующие переменные двух элементов (цикл привязки и пользовательский выбор) - PullRequest
0 голосов
/ 24 марта 2011

Мне нужна помощь в сжатии моего скрипта, чтобы #div_x был связан с отдельным элементом img_x.

Мой проект использует ui-selectable, чтобы захватывать точки на карте и возвращать набор изображений в отдельном divчерез цикл jquery (как здесь 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>');}

и т. Д.

Мой вопрос:

Можно ли выполнить это одним аргументом, используя вместо переменной xвыписывание каждой строки, совпадающей с точкой_а в img_a, точкой_б в img_b и т. д. То есть

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

Спасибо!Я потратил некоторое время на поиски хорошего подхода.

1 Ответ

0 голосов
/ 01 апреля 2011

Спасибо 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>" );
});
...