zoukankan      html  css  js  c++  java
  • 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下载


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

  • 相关阅读:
    28.数组中出现次数超过长度一半的数字(python)
    [leetcode] 145. 二叉树的后序遍历
    [leetcode] 144. 二叉树的前序遍历
    [leetcode] 94. 二叉树的中序遍历
    [leetcode] 93. 复原IP地址
    [leetcode] 206. 反转链表
    [leetcode] 92. 反转链表 II
    [leetcode] 91. 解码方法
    [leetcode] 90. 子集 II.md
    [leetcode] 88. 合并两个有序数组
  • 原文地址:https://www.cnblogs.com/zfyouxi/p/4750926.html
Copyright © 2011-2022 走看看