1

我希望简化创建 html 电子邮件的过程，使拖放不同元素以编译最终产品变得简单。

我创建了一系列 html 内容块（1 个专栏故事、2 个专栏故事、广告块等），并希望创建一些允许用户：

  1. 根据需要将 html 内容块元素拖到舞台上，并在任何时候对它们进行排序
  2. 编辑每个内容块中的文本和图像区域
  3. 允许我导出最终编译的 html - 为第 3 方电子邮件管理应用程序做好准备

我看过 jQuery sortable & draggable，但知道这些只是图片的一小部分。我想知道是否有人创造了类似的东西，或者能够为我指出正确的方向以实现这一目标？

4

3 回答 3

0

试试 Jquery Templates，它为你提供了更多的灵活性Jquery Template

来自 Jquery 示例。

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

<ul id="movieList"></ul>

<script>
var movies = [  // data for the template 
    { 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>

如果你想要更多的功能，你可以试试 HandleBar.JS HandleBar JS

  1. 基本 HandleBarjs 表达式
于 2012-04-20T06:45:07.323 回答
0

是的，这是可能的，我之前已经完全构建了这个工具。

一些陷阱：

  • 您还需要一些服务器端代码，因为最终用户使用的任何浏览器都会稍微更改代码。之后我使用了一些后处​​理来清理不必要/有害的代码。
  • 避免使用 WYSIWYG 编辑器，因为您将花费大量时间删除他们的垃圾，同时努力保持用户想要拥有的风格。相反，请使用contenteditable属性和您自己的简单样式选项来设置粗体、斜体和您想要提供的任何其他内容。
  • 请注意您可以在 Web 浏览器（使用 CSS3）中执行的所有您无法在电子邮件中执行的操作。首先在电子邮件客户端中对模板进行渲染测试，然后将它们转换为您的模块。
于 2012-05-23T22:02:12.100 回答
0 
/* Render the template with the movies data and insert
   the rendered HTML under the "movieList" element */

$( "#movieTemplate" ).tmpl( movies ).appendTo( "#movieList" );
于 2012-06-04T13:12:30.247 回答