Обновление изображения калитки с помощью JavaScript

Я пытаюсь обновить изображение с помощью JavaScript, когда пользователь фокусируется на текстовом поле. В настоящее время есть следующий код HTML/Wicket:

<div class="input-prepend">
    <span class="add-on">
        <wicket:link>
            <img src="img/username-img-1.png" id="username-img"/>
        </wicket:link>
    </span>
    <input type="text" id="username" placeholder="User Name" wicket:id="username" />
</div>

И следующий код JavaScript:

$(document).ready(function() {  
    $('#username').focus(function() {
        $('#username-img').attr("src","img/username-img-2.png" );
    });
});

Очевидно, что это не работает, так как у Wicket есть собственный способ ссылки на ресурсы. Я хотел бы знать мои другие варианты. Спасибо!


javascript jquery wicket wicket-1.5
person Kevin D.    schedule 21.12.2012    source источник
comment
Не могли бы вы поместить изображения в папку статических ресурсов? Или изображения генерируются?   -  person RJo    schedule 21.12.2012
comment
У меня они в упаковке в пределах src/main/resources/   -  person Kevin D.    schedule 07.01.2013

Ответы (1)


arrow_upward
1
arrow_downward

Насколько я понимаю, у вас есть изображение в папке webapp. Итак, проблема в том, что вам нужно переписать URL-адрес, чтобы он относился к контексту, используя UrlUtils.rewriteToContextRelative.

Что-то вроде этого может сработать:

public void renderHead(IHeaderResponse response) {

    StringBuilder script = new StringBuilder();
    script.append("$('#username').focus(function() {");
    script.append("$('#username-img').attr(\"src\",\"");
    script.append(UrlUtils.rewriteToContextRelative("img/logo.png", RequestCycle.get()));
    script.append("\");");
    script.append("});");

    response.render(OnDomReadyHeaderItem.forScript(script.toString()));
}
person jordeu    schedule 21.12.2012
comment
На самом деле, у меня есть изображение в пакете под src/main/resources относительно моего CSS (также находится в src/main/resources) - person Kevin D.; 26.12.2012