|
|
<!DOCTYPE html>
|
|
|
<!-- 文档类型声明，表明这是一个HTML文档，遵循HTML相关标准规范 -->
|
|
|
<html>
|
|
|
<head>
|
|
|
<!-- 页面标题，目前为空，后续可根据实际需求设置具体显示的标题内容 -->
|
|
|
<title></title>
|
|
|
<!-- 引入外部的JavaScript文件，路径为相对路径的../internal.js，通常这个文件包含了页面通用的一些脚本逻辑 -->
|
|
|
<script type="text/javascript" src="../internal.js"></script>
|
|
|
<!-- 引入外部的CSS样式表文件，类型为text/css，文件名为edittable.css，用于设置页面的样式 -->
|
|
|
<link rel="stylesheet" type="text/css" href="edittable.css">
|
|
|
</head>
|
|
|
<body>
|
|
|
<!-- 创建一个应用了wrapper类的div元素，作为页面内容的一个主要包裹容器，方便对内部元素进行整体布局等操作 -->
|
|
|
<div class="wrapper">
|
|
|
<!-- 创建一个应用了left类的div元素，通常用于页面布局中靠左边的部分内容展示 -->
|
|
|
<div class="left">
|
|
|
<!-- 创建一个应用了section类的div元素，可能代表页面中的一个功能或内容板块 -->
|
|
|
<div class="section">
|
|
|
<!-- 创建一个h3标题元素，其内部的文本内容通过id为lang_tableStyle的变量来动态设置（一般会通过脚本在运行时替换成实际文本） -->
|
|
|
<h3><var id="lang_tableStyle"></var></h3>
|
|
|
<ul>
|
|
|
<!-- 创建一个li列表项元素 -->
|
|
|
<li>
|
|
|
<!-- 创建一个label标签，设置了onselectstart属性为"return false"，用于禁止在该标签内容上进行文本选中操作 -->
|
|
|
<label onselectstart="return false">
|
|
|
<!-- 创建一个复选框类型的input元素，设置了id为J_title，name为style，用于表单交互，比如选择某种表格样式相关的功能 -->
|
|
|
<input type="checkbox" id="J_title" name="style" />
|
|
|
<!-- 内部的文本内容通过id为lang_insertTitle的变量来动态设置（运行时替换为实际文本） -->
|
|
|
<var id="lang_insertTitle"></var>
|
|
|
</label>
|
|
|
</li>
|
|
|
<li>
|
|
|
<label onselectstart="return false">
|
|
|
<input type="checkbox" id="J_titleCol" name="style" />
|
|
|
<var id="lang_insertTitleCol"></var>
|
|
|
</label>
|
|
|
</li>
|
|
|
</ul>
|
|
|
<ul>
|
|
|
<li>
|
|
|
<label onselectstart="return false">
|
|
|
<input type="checkbox" id="J_caption" name="style" />
|
|
|
<var id="lang_insertCaption"></var>
|
|
|
</label>
|
|
|
</li>
|
|
|
<li>
|
|
|
<label onselectstart="return false">
|
|
|
<input type="checkbox" id="J_sorttable" name="style" />
|
|
|
<var id="lang_orderbycontent"></var>
|
|
|
</label>
|
|
|
</li>
|
|
|
</ul>
|
|
|
<!-- 引入一个应用了clear类的div元素，用于清除前面元素浮动带来的影响，确保后续布局正常 -->
|
|
|
<div class="clear"></div>
|
|
|
</div>
|
|
|
<div class="section">
|
|
|
<h3><var id="lang_tableSize"></var></h3>
|
|
|
<ul>
|
|
|
<li>
|
|
|
<label>
|
|
|
<!-- 创建一个单选框类型的input元素，id为J_autoSizeContent，name为size，用于表单交互中选择表格尺寸相关的设置 -->
|
|
|
<input type="radio" id="J_autoSizeContent" name="size" />
|
|
|
<var id="lang_autoSizeContent"></var>
|
|
|
</label>
|
|
|
</li>
|
|
|
<li>
|
|
|
<label>
|
|
|
<input type="radio" id="J_autoSizePage" name="size" />
|
|
|
<var id="lang_autoSizePage"></var>
|
|
|
</label>
|
|
|
</li>
|
|
|
</ul>
|
|
|
<div class="clear"></div>
|
|
|
</div>
|
|
|
<div class="section">
|
|
|
<h3><var id="lang_borderStyle"></h3>
|
|
|
<ul>
|
|
|
<li>
|
|
|
<!-- 创建一个span元素，内部文本内容通过id为lang_color的变量动态设置 -->
|
|
|
<span><var id="lang_color"></var></span>
|
|
|
<!-- 创建一个文本框类型的input元素，应用了tone类，设置为只读状态，id为J_tone，可能用于显示某种颜色相关的值等 -->
|
|
|
<input type="text" class="tone" id="J_tone" readonly='readonly' />
|
|
|
</li>
|
|
|
</ul>
|
|
|
<div class="clear"></div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="right">
|
|
|
<div class="section">
|
|
|
<h3><var id="lang_example"></var></h3>
|
|
|
<!-- 创建一个应用了preview类且id为J_preview的div元素，可能用于展示表格相关的示例内容 -->
|
|
|
<div class="preview" id="J_preview">
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<!-- 引入外部的JavaScript文件edittable.js，通常包含了和当前页面编辑表格功能相关的具体脚本逻辑 -->
|
|
|
<script type="text/javascript" src="edittable.js"></script>
|
|
|
</body>
|
|
|
</html> |
