Onchange не обновляет источник изображения значением - PullRequest
0 голосов
/ 28 февраля 2012

Я пытаюсь изменить аватар пользователя в зависимости от того, какую учетную запись он выбрал из выпадающего списка. Я написал jQuery, который, как мне кажется, должен работать, поскольку я использую его для аналогичного приложения, чтобы делать то же самое (с помощью URL-адресов facebook, а не twitter)

http://jsfiddle.net/JPT3K/3/

<select id="twid-4646464" onChange="updateTwPic(4646464);">
  <option value="billpull-1">BillPull</option>
  <option value="billpull1-2">BillPull1</option>
</select>

 function updateTwPic(postid){
    var twhandle = $('#twid-'+postid).val().split('-');
    twhandle = twhandle[0];
    var picurl = "http://api.twitter.com/1/users/profile_image/"+twhandle;
    $('#twpic-'+postid).attr('src',picurl);
 }​

1 Ответ

2 голосов
/ 29 февраля 2012

Ваш код работает нормально, если настроен правильно: http://jsfiddle.net/86nfP/

Обратите внимание, что я изменил onDomReady на no wrap (head).

Так что пошло не так? updateTwPic был определен не в глобальной области 1011 *, а в обработчике событий ready, поэтому JavaScript не смог его найти.
Если бы вы посмотрели на консоль, вы бы увидели:

Uncaught ReferenceError: updateTwPic не определен


Вы можете просто прикрепить обработчик событий с помощью jQuery, чтобы избежать таких проблем:

$(function() {
    // this code runs when the DOM is loaded, no matter where it is located
    $('#twid-4646464').change(function() {
        var postid = this.id.split('-')[1],
            picurl = "http://api.twitter.com/1/users/profile_image/"+this.value.split('-')[1];
        $('#twpic-'+postid).attr('src',picurl);
    });
});

Вы также можете использовать атрибуты data-*, которые были бы еще чище:

<select id="twid-4646464" data-postid="4646464">

и в обработчике событий:

var postid = $.data(this, 'postid');
...