1

ユーザーがテキスト フィールドに注目しているときに、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 にはリソースを参照する独自の方法があるため、明らかにこれは機能しません。他のオプションを知りたいです。ありがとう!

4

1 に答える 1

1

フォルダに画像があることを理解してい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()));
}
于 2012-12-21T09:02:38.463 に答える