jsmart 前结合案例

前绑定jsmart这是一个不错的选择。之前通过经常使用的项目中的。最近涉及的领域的后端部。jsmart有些使用相对较少，主要是因为他想引用文件，我写的模板，在一个简单的项目，直接使用js界，很复杂的前端绑定中才使用。

如今对其整理一下。以免后面忘记：

首先要引入jsmart文件

<script src="js/jsmart.js" type="text/javascript"></script>

其次。用ajax等调用后端接口，返回json数据，在返回数据中。。。例如以下：

js：

$.ajax({
     url:"",
    datatype:"json",
   type:"get",
   success:function(data,status){
			var tpl = new jSmart(document.getElementById('myrecord').innerHTML);
			var res = tpl.fetch(data);
			$("#recordlist").html(res);
   }
})

模板语法：

<script id="myrecord" type="text/x-jsmart-tmpl">

//if语句：
					{if ($result.accountstate == 1)}
						<a href="javascript:setaccountstate(0);">我要下班</a>
					{else}
						<a href="javascript:setaccountstate(1);">我要上班</a>
					{/if}

//循环语句：
 {foreach  $replies as $i=>$reply}
{/foreach}

//for语句
{for $i=1 to 5}
   {if $i == 3}
      {continue}
   {/if}
   {$i}
{/for}

{for $i=-5 to -1}
   {$i}
{/for}

{$num=10}
{for $i=$num to 1 step -2}
   {$i}
{/for}

{$ar = ['a','b','c','d']}
{for $i=0 to $ar|count-1 max=3}
   {$ar[$i]}
{/for}

{$empty = []}
{for $i=0 to $empty|count-1}
   {$ar[$i]}
{forelse}
   array is empty
{/for}

</script>

html

                <div class="ask_detail" id="recordlist">
                    <img src="/images/waiting.gif" />
                </div>

jsmart demo下载

版权声明：本文博客原创文章，博客，未经同意，不得转载。