Обновление IMG SRC при нажатии кнопки

Question

Я написал простую функцию, чтобы получить изображение профиля аутентифицированного пользователя и установить для него значение <img>. Пока атрибут src обновляется правильно, изображение фактически не меняется.

function getDefault(){
    FB.api('/me', function(response) {
        $('#default').val("http://graph.facebook.com/" + response.id + "/picture");
    });
    alert($('#default').val());
    }

...

<img id="default" src="getDefault()"/>
<button onclick="getDefault()">Click to see your profile picture!</button>

Answer 1

Зачем вам устанавливать src на вызов функции, который не возвращает значение? Это даст вам неопределенное значение .src. src должен быть URL. Вы можете достичь этого, либо вернув URL из вашей функции, либо установив свойство .src непосредственно в URL. Кроме того, изображение не имеет свойства .value.

Измените ваш HTML на это:

<img id="default"/>
<button id="getDefault">Click to see your profile picture!</button>

И ваш JS к этому:

$('#getDefault').click(function(){
    FB.api('/me', function(response) {
        $("#default").attr('src', 'http://graph.facebook.com/' + response.id + '/picture');
    });
});

Answer 2

Атрибут не является «значением». Это "SRC". Итак ... это должно быть так:

$('#getDefault').click(function(){
    FB.api('/me', function(response) {
        $('#default').attr('src', 'http://graph.facebook.com/' + response.id + '/picture');
        alert($('#default').attr('src'));
    });

});

<img id="default" src="getDefault()"/>
<button id="getDefault">Click to see your profile picture!</button>

Обновление ?: Кроме того, оповещение должно быть внутри, потому что, возможно, вы не получите никакого значения снаружи ...