first commit

2025-02-20 14:59:35 +08:00
parent d7be84fac6
commit d4a3bb8ffc
2541 changed files with 336536 additions and 0 deletions
@@ -0,0 +1,83 @@
+<#def title = "复制功能"/>
+<#def keyword = "ZhiqimUI"/>
+<#def desc = "由于各浏览器剪贴板功能不一致，功能使用复杂，因此知启蒙是利用Flash的sprite容器制作的剪贴板功能，以达到跨浏览器支持对文本的复制功能。"/>
+<#def prevUrl = "../nav/dropdown.htm"/>
+<#def nextUrl = "ajax.htm"/>
+${zhiqim_com_header()}
+${zhiqim_com_topnav("document")}
+
+<script>
+function doChange(tabnav)
+{
+    doUpdateCode(Z(tabnav));
+}
+
+function doUpdateCode($this)
+{//更新代码
+    var html = $this.find("section > div").htmlt();
+    var ind = html.indexOf("&lt;div");
+    if (ind != -1){
+        html = html.substring(0, ind);
+    }
+        
+    $this.find("section > div").next("div > span").html(html);
+}
+</script>
+
+<!--容器开始 -->
+<div id="container" class="container">
+<!--边导航-->
+${zhiqim_com_ui("tutorial", "ui", "tool", "copy")}
+
+<!--主体-->
+<div id="mainbody" class="mainbody">
+${zhiqim_com_breadcrumb("文库", "教程", "复制功能")}
+<div class="content">
+
+<#-- 标题 -->
+<div class="z-relative-left z-w100p z-pd16 z-bg-blue z-px18 z-lh200p z-bold" style="border-left:5px solid #2293e4">
+    <p class="z-text-blue">复制功能：</p>
+    <p class="z-color-333" style="text-indent:38px;">
+        在ZhiqimUI中，提供Z.copy(value);方法用于复制内容，该方法需要浏览器的支持HTML5，当前主流浏览器都支持
+    </p>
+</div>
+
+<#-- 一、HTML5复制模式 -->
+<div class="tutorial title">HTML5复制模式</div>
+
+<div class="z-tabnav z-bordered" data-role="z-tabnav" onchange="doChange(this);">
+<nav>
+    <ul class="zi-float-left">
+        <li class="z-active">示例</li>
+        <li>代码</li>
+        <li>说明</li>
+    </ul>
+</nav>
+<section style="min-height:150px;">
+<div class="z-active z-pd10 z-px16" style="padding-top:40px">
+    <!-- 复制按钮 -->
+    <button class="z-button z-cyan z-w200" onclick="Z.copy(Z('#copy_content').val());Z.tips('复制成功');">点我复制下面文本框中的内容</button>
+    <br><br>
+    <!-- 复制内容 -->
+    <textarea id="copy_content" class="z-textarea z-w200">默认简单模式H5</textarea> 
+</div>
+<div class="z-relative-left z-w100p z-pd10">
+    <span class="z-text-prewrap z-pre"></span>
+</div>
+    
+<div class="z-pd10 z-px16 z-lh200p">
+    1、定义一个button，编写onclick方法，方法内调用Z.copy函数即可<br>
+    2、调用完成后，还可以使用Z.tips函数显示一下复制成功信息
+</div>
+</section>
+</div>
+
+${zhiqim_com_chapter()}
+</div>
+
+<!-- 主体结束  -->
+</div>
+
+<!-- 容器结束  -->
+</div>
+${zhiqim_com_footer()}