Селектор изображений jQuery с переменными в качестве атрибутов - PullRequest
Новая
       14

Селектор изображений jQuery с переменными в качестве атрибутов

0 голосов
/ 20 февраля 2011

У меня проблемы с селекторами jQuery (снова).Я уверен, что это действительно просто, но я, кажется, изо всех сил.

Это селектор, который вызывает у меня проблемы.Все переменные ClassImg и TitleImg кажутся нормальными. 

$('img [class=' + ClassImg + '][attr="1"][title=' + TitleImg + ']').attr("src", "../graphics/stars/FullStar.png");

Я возился с этим здесь: http://jsfiddle.net/PottyMonster/aYr8e/

Заранее спасибо за вашу помощь.

Dan

1 Ответ

1 голос
/ 20 февраля 2011

Некоторые полезные примечания:

  1. Вы можете использовать img.' + ClassImg селектор класса вместо селектора [attr] для имен классов.
  2. Полагаю, вы имеете в виду alt=1
  3. Поскольку вы используете jquery, посмотрите на использование .hover () , поскольку это поможет произвести меньше Ненавязчивый javascript .
  4. Если вы используете ненавязчивую обертку javascriptваши обработчики событий в $(document).ready(function(){}); или просто $(function(){});

Из того, что вы видите в вашем примере, вы хотите выделить звезды при наведении курсора.Поскольку у вас есть звезды под тегом <p>, вы можете позвонить родительскому элементу на <img>, а затем использовать селектор : lt () , чтобы выбрать <img/> звездочек меньше, чем текущая звезда, над которой вы находитесьнад.Собрав все это вместе, получим что-то вроде следующего: 

$("img").hover(function() {
    var AltImg = $(this).attr("alt");
    $(this).parent().children(":lt(" + AltImg + ")").attr("src", "http://www.sweetashoney.co.uk/graphics/stars/FullStar.png");
},
function() {
    $('img[name=FeedbackStar]').attr("src", "http://www.sweetashoney.co.uk/graphics/stars/EmptyStar.png");
});

Пример jsfiddle .

Надеюсь, это поможет!Если я пропустил знак, дайте мне знать, и я вернусь.

...