0

我正在尝试使用客户端模板库dust.js。我想使用使用 Ajax(Json 格式)从服务器检索到的值来填充“img”标签(代码中的 {profile.picUrl})的“src”属性。

问题是在进行 Ajax 调用之前,浏览器会尝试加载图像,从而导致 HTTP 404 响应(“src”包含模板占位符)。有没有办法在不向服务器发出 404 请求的情况下做到这一点?

这是一个复制问题的示例:

<body>
    <div class="template">
    hi {profile.user}
    <img src="{profile.picUrl}" />
    <div id="actions">
        {#actions}
        <a href="{url}">{text}</a><br /><br />
        {/actions}
    </div>
    </div>
    <script>
       function fillTemplates(responsedat, status, xhr) {
            if (status === "success") {
                template = $('.template').html();
                dust.compileFn(template,"t");
                dust.render("t", responsedat, function (err,out) {
                    if (err) {
                        console.log(err);
                        return;
                    }
                    else {
                        $('.template').html(out);
                    }

                });
                $('.template').show();
            }
        }
        $.get('landing.jsp', {}, fillTemplates);
        $.ready(function () {
            $('.template').hide();
        });
    </script>
</body>

PS:大括号({profile.user})中的名称用于在dust.js语法中填充模板中的值

4

2 回答 2

1

通常,当我看到正在使用客户端模板时,模板本身并不是“活动”DOM 的一部分。它通常在脚本块中,例如来自主干的示例: http: //coenraets.org/blog/2012/01/backbone-js-lessons-learned-and-improved-sample-app/

示例:http: //jsfiddle.net/Rj2Hd/1/

<html>

<body>
    <script type="text/template" id="template">
    hi {profile.user}
    <img src="{profile.picUrl}" />
    <div id="actions">
        {#actions}
        <a href="{url}">{text}</a><br /><br />
        {/actions}
    </div>
    </script>
    <script>
       function fillTemplates(responsedat, status, xhr) {
            if (status === "success") {
                template = $('#template').html();

alert(template);
        // your stuff here
            }
        }


        $(function () {
            fillTemplates(null, 'success', null);
        });
    </script>
</body>

</html>
于 2012-11-08T18:58:59.707 回答
0

如果您可以更改源的占位符值,那么它应该像给它一个真实地址一样简单,或者在您收到 AJAX 的回复之前不提供一个。

于 2012-11-08T18:57:14.847 回答