jQuery 模板的问题。对象不支持此方法错误

发布于 2024-10-13 07:56:40 字数 1200 浏览 1 评论 0原文

我正在学习 jquery 中的模板。并完成了我测试的一些示例代码。但这似乎不起作用。

<html>
<head>
    <script src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.2.js " type="text/javascript"></script>
    <script src="http://ajax.microsoft.com/ajax/jquery.templates/beta1/jquery.tmpl.js" type="text/javascript" />
</head>

<body>

    <h2>ViewPage1</h2>

    <script id="movieTemplate" type="x-jquery-tmpl">
        <li><b>${Name}</b> (${ReleaseYear})</li>
    </script>

    <div id="movieList"></div>

    <script type="text/javascript">
            var movies = [
                { Name: "The Red Violin", ReleaseYear: "1998" },
                { Name: "Eyes Wide Shut", ReleaseYear: "1999" },
                { Name: "The Inheritance", ReleaseYear: "1976" }
                ];

            // Render the template with the movies data and insert
            // the rendered HTML under the "movieList" element
            $("#movieTemplate").tmpl(movies).appendTo("#movieList");
    </script>
</body>

调试时我可以看到问题出在 .appendTo() 方法上。我还可以在智能感知中看到该方法不在那里。

我做错了什么？

原文

I am learning about template in jquery. And have get over some example code that I testing. But it doesn't seem to work.

<html>
<head>
    <script src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.2.js " type="text/javascript"></script>
    <script src="http://ajax.microsoft.com/ajax/jquery.templates/beta1/jquery.tmpl.js" type="text/javascript" />
</head>

<body>

    <h2>ViewPage1</h2>

    <script id="movieTemplate" type="x-jquery-tmpl">
        <li><b>${Name}</b> (${ReleaseYear})</li>
    </script>

    <div id="movieList"></div>

    <script type="text/javascript">
            var movies = [
                { Name: "The Red Violin", ReleaseYear: "1998" },
                { Name: "Eyes Wide Shut", ReleaseYear: "1999" },
                { Name: "The Inheritance", ReleaseYear: "1976" }
                ];

            // Render the template with the movies data and insert
            // the rendered HTML under the "movieList" element
            $("#movieTemplate").tmpl(movies).appendTo("#movieList");
    </script>
</body>

When debugging I can see that the problem is with the .appendTo() method. And I can also see in intellisens that that method is not in there.

What have I done wrong?

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

雨夜星沙 2024-10-20 07:56:40

标题中的脚本定义似乎有问题：

<head>
    <script src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.2.js " type="text/javascript"></script>
    <script src="http://ajax.microsoft.com/ajax/jquery.templates/beta1/jquery.tmpl.js" type="text/javascript" />
</head>

脚本标记需要有一个结束标记。本质上你的 tmpl 脚本没有加载。我确实注意到这是 tmpl 示例中的一个错误，所以并不是你的错。如果您更改第二个以匹配第一个，则效果很好：

<head>
    <script src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.2.js " type="text/javascript"></script>
    <script src="http://ajax.microsoft.com/ajax/jquery.templates/beta1/jquery.tmpl.js" type="text/javascript"></script>
</head>

示例：
http://jsfiddle.net/UZ62w/

It seems to be a problem with the script definitions in the header:

<head>
    <script src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.2.js " type="text/javascript"></script>
    <script src="http://ajax.microsoft.com/ajax/jquery.templates/beta1/jquery.tmpl.js" type="text/javascript" />
</head>

The script tag needs to have a closing </script> tag. Essentially your tmpl script wasn't loading. I did notice this is a bug in the tmpl example, so not really your fault. If you change the second one to match the first, it works fine:

<head>
    <script src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.2.js " type="text/javascript"></script>
    <script src="http://ajax.microsoft.com/ajax/jquery.templates/beta1/jquery.tmpl.js" type="text/javascript"></script>
</head>

Example:
http://jsfiddle.net/UZ62w/

回复收藏 0 原文

梦回梦里 2024-10-20 07:56:40

我很确定这与 tmpl 不返回 jQuery 对象有关。尝试修改你的js以类似于这样的

var movies = [
            { Name: "The Red Violin", ReleaseYear: "1998" },
            { Name: "Eyes Wide Shut", ReleaseYear: "1999" },
            { Name: "The Inheritance", ReleaseYear: "1976" }
            ],
template = $("#movieTemplate").tmpl(movies);

$("#movieList").append(template);

编辑：这是一个jsfiddle显示有用。

I'm pretty sure it has to do with the tmpl not returning a jQuery object. Try modifying your js to resemble something like this

var movies = [
            { Name: "The Red Violin", ReleaseYear: "1998" },
            { Name: "Eyes Wide Shut", ReleaseYear: "1999" },
            { Name: "The Inheritance", ReleaseYear: "1976" }
            ],
template = $("#movieTemplate").tmpl(movies);

$("#movieList").append(template);

edit: Here's a jsfiddle showing it works.

回复收藏 0 原文

~没有更多了~