编辑器

转载 2004年09月07日 16:04:00


<!--版权归flashsoft2000所有,伟COOL改编-->
<html>
<head>
<title>CreateCode</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<script language="javascript">
//生成代码
function createCode()
{
        totalheight = parseInt(fcreate.bodyheight.value) + fcreate.headheight.value * (fcreate.itemcount.value - 1);
        textCode.value = text1.value +
                "var headHeight = " + fcreate.headheight.value + ";" +
                "var bodyHeight = " + fcreate.bodyheight.value + ";" +
                "var objcount = " + fcreate.itemcount.value + ";" +
                "var step = " + fcreate.mspeed.value + ";" +
                text2.value +
                ".headtd1 {  background: #" + fcreate.headcolorn.value + "; border: 2px outset; border-color: #" + fcreate.lbordern.value + " #" + fcreate.dbordern.value + " #" + fcreate.dbordern.value + " #" + fcreate.lbordern.value + "; cursor: hand; font-size: 9pt}" +
                ".headtd2 {  background: #" + fcreate.headcolora.value + "; border: 2px outset; border-color: #" + fcreate.lbordera.value + " #" + fcreate.dbordera.value + " #" + fcreate.dbordera.value + " #" + fcreate.lbordera.value + "; cursor: hand; font-size: 9pt}" +
                ".bodytd  {  background: #" + fcreate.bodycolor.value + "; border: 2px outset; border-color: #" + fcreate.lborderb.value + " #" + fcreate.dborderb.value + " #" + fcreate.dborderb.value + " #" + fcreate.lborderb.value + "; font-size: 9pt}" +
                text3.value +
                "<div id='mainboard' style='position:absolute; left:2px; top:2px; width:120px; height:" + totalheight + "px; z-index:1; overflow: hidden; background: #" + fcreate.bodycolor.value + ";'> ";

        itemtop = 0;
        for (i = 1; i <= parseInt(fcreate.itemcount.value); i++)
        {
                textCode.value += "<div id='item" + i + "body' style='position:absolute; left:0; top:" + itemtop + "; width:120px; height:" + fcreate.bodyheight.value + "px; z-index:" + (i+1) +"; overflow: hidden'>" +
                "<table width='100%' border='0' height='100%' cellpadding='2' cellspacing='0'>" +
                "<tr>" +
        "<td id='item" + i + "head' height='" + (fcreate.headheight.value-2) + "' class=";
if (i == 1)
        textCode.value += "'headtd2'";
else textCode.value += "'headtd1'";
textCode.value += " onclick='showme(item" + i + "body,this)' align='center'>";
//textCode.value += getValue("fcreate.item" + i);
textCode.value +=document.all["item"+i].value+"</td>"+
                "</tr>" +
                "<tr>" +
        "<td class='bodytd' align='center'>" +
        "test" +
        "</td>" +
                "</tr>" +
                        "</table>" +
                        "</div>";
                if (i == 1)
                        itemtop += parseInt(fcreate.bodyheight.value);
                else itemtop += parseInt(fcreate.headheight.value);
        }
        textCode.value += "</div></body></html>"
}
//获取对象的值
function getValue(obj)
{
        //obj = Object(obj);
        return obj.value;
}
//清空代码
function clearCode()
{
        textCode.value = "";
}
//预览代码
function prevCode()
{
        createCode();
        open().document.write(textCode.value);
}
//选择代码
function selectCode()
{
        textCode.select();
}
//根据输入的数字,自动生成子菜单的填写项
function checkItems()
{
        if ((fcreate.itemcount.value.length > 0 && isNaN(fcreate.itemcount.value)) || fcreate.itemcount.value.length == 0)
        {
                alert("请输入数字!");
                fcreate.itemcount.focus();
        }
        else
        {
                if (fcreate.itemcount.value > 50)
                {
                        alert("太夸张了吧,小一点呀,不用这么玩命吧!(50以下,含50)")
                        fcreate.itemcount.focus();
                        return;
                }
                if (fcreate.itemcount.value < 1)
                {
                        alert("太夸张了吧,一个不要你要做什么!(1以上,含1)")
                        fcreate.itemcount.focus();
                        return;
                }
                itemtext = "<table width='700' border='0' align='center' cellpadding='1' cellspacing='1'>";
                for (i = 1; i <= fcreate.itemcount.value; i++)
                {

                        itemtext += "<tr>"+
                                "<td class='td2' width='76'>菜单项目"+i+"</td>" +
                                "<td colspan='2' class='td2'>" +
                        "        <input type='text' name='item" + i + "' class='back2' style='width:200' value='菜单" + i + "'>" +
                                "</td>" +
                                "<td class='td2' width='173'>菜 单 项 目 内  容  网  页</td>" +
                                "<td colspan='2' class='td2'>" +
                        "        <input type='file' name='itemsrc" + i + "' class='back2' style='width:200'>" +
                                "</td>" +
                                "</tr>";
                }
                itemtext+="</table>"
                document.all.itemmenu.innerHTML = itemtext;
        }
}
//检查是否是一个合法的颜色数值
function changebkclr(obj)
{
        hexv = new Array("0","1","2","3","4","5","6","7","8","9","a","b","c","d","e","f");
        flag = false;
        if (obj.value.length != 6)
        {
                alert("请用正确填写!(六位数)");
                obj.focus();
        }
        else
        {
                for (i = 0; i < 6; i++)
                {
                        for (j = 0; j <16; j++)
                                if (obj.value.charAt(i).toLowerCase() == hexv[j])
                                        flag = true;
                        if (!flag)
                        {
                                alert("请用十六进制填写。(0-9,a-f)");
                                obj.focus();
                                return;
                        }
                        flag = false;
                }
                obj.style.background=obj.value;
        }
}
//检查是否是一个合法的数字
function checknum(obj)
{
        if (isNaN(obj.value))
        {
                alert("请输入数字!");
                obj.focus();
                return;
        }
}
//检查改变数值的速度合法性
function changespd(obj)
{
        fcreate.mspeed.value = 1;
}
//检查是否是一个合法的速度
function checkspeed(obj)
{
        if (isNaN(obj.value))
        {
                alert("请输入数字!");
                obj.focus();
        }
        else
        {
                if ((obj.form.bodyheight.value - obj.form.headheight.value)%obj.value != 0)
                {
                        alert("请确认可以被 “菜单体高度 - 菜单题头高度” 整除");
                        obj.focus();
                }
        }
}
//控制总题目的填写
function ctrltitle(obj)
{
        if (obj.value == "有")
                obj.form.titlename.disabled = false;
        else
                obj.form.titlename.disabled = true;
}
</script>
<style type="text/css">
<!--
.td1{  font-size: 9pt; background: #66CCFF}
.td2{  font-size: 9pt; background: #66aaFF}
.back1 {  font-size: 9pt; width:100}
.back2 {  font-size: 9pt; background: #BECFEE}
-->
</style>
</head>

<body bgcolor='#FFFFFF' text='#000000'>
<div align="center">
          <textarea name="textCode" rows="28" style="width:700" class="back2" readonly></textarea>
  <br>
  <input type="button" name="btnCreate" value="<- 生成代码 (ALT+M)" class="back2" style="width:150" onclick="createCode()" accessKey="m">
  <input type="button" name="btnClear" value="#= 清空代码 (ALT+C)" class="back2" style="width:150" onclick="clearCode()" accessKey="c">
  <input type="button" name="btnPrev" value="O- 预览效果 (ALT+P)" class="back2" style="width:150" onclick="prevCode()" accessKey="p">
  <input type="button" name="btnSelect" value="@@ 全选代码 (ALT+A)" class="back2" style="width:150" onclick="selectCode()" accessKey="a">
</div>
<form name="fcreate" method="post" action="">
  <table width="700" border="0" align="center" cellpadding="2" cellspacing="1">
    <tr>
      <td class="td1" width="13%" height="13">菜单项目个数</td>
      <td class="td1" width="12%" height="13">
        <input type="text" name="itemcount" style="width:40" class="back2" onblur="checkItems()" value="2">
      </td>
      <td class="td1" width="13%" height="13">菜单题头高度</td>
      <td class="td1" width="12%" height="13">
        <input type="text" name="headheight" class="back2" value="22" style="width:50" onblur="checknum(this)" onchange="checkspeed(fcreate.mspeed)">
      </td>
      <td class="td1" width="13%" height="13">菜单体高度</td>
      <td class="td1" width="12%" height="13">
        <input type="text" name="bodyheight" class="back2" value="202" style="width:50" onblur="checknum(this)" onchange="checkspeed(fcreate.mspeed)">
      </td>
      <td class="td1" width="13%" height="13">填写移动速度</td>
      <td class="td1" width="12%" height="13">
        <input type="text" name="mspeed" class="back2" value="10" style="width:50" onblur="checkspeed(this)">
      </td>
    </tr>
    <tr>
      <td class="td1" colspan="8" height="55">
        <table width="100%" border="0" align="center" cellpadding="0" cellspacing="0" dwcopytype="CopyTableRow">
          <tr>
            <td class="td1" width="20%">一 般 题 头 颜 色</td>
            <td class="td1" width="16%">
              <input type="text" name="headcolorn" class="back1" style="background:#00A4E1" value="00A4E1" onblur="changebkclr(this)" maxlength="6">
            </td>
            <td class="td1" width="16%">亮 边 颜 色</td>
            <td class="td1" width="16%">
              <input type="text" name="lbordern" class="back1" style="background:#00BBFF" value="00BBFF" onblur="changebkclr(this)" maxlength="6">
            </td>
            <td class="td1" width="16%">暗 边 颜 色</td>
            <td class="td1" width="16%">
              <input type="text" name="dbordern" class="back1" style="background:#0077FF" value="0077FF" onblur="changebkclr(this)" maxlength="6">
            </td>
          </tr>
          <tr>
            <td class="td1" width="20%">当 前 题 头 颜 色</td>
            <td class="td1" width="16%">
              <input type="text" name="headcolora" class="back1" style="background:#20C1FF" value="20C1FF" onblur="changebkclr(this)" maxlength="6">
            </td>
            <td width="16%"  class="td1">亮 边 颜 色</td>
            <td  class="td1" width="16%">
              <input type="text" name="lbordera" class="back1" style="background:#60D3FF" value="60D3FF" onblur="changebkclr(this)" maxlength="6">
            </td>
            <td  class="td1" width="16%">暗 边 颜 色</td>
            <td  class="td1" width="16%">
              <input type="text" name="dbordera" class="back1" style="background:#0077FF" value="0077FF" onblur="changebkclr(this)" maxlength="6">
            </td>
          </tr>
          <tr>
            <td class="td1" width="20%">菜 单 主 体 颜 色</td>
            <td class="td1" width="16%">
              <input type="text" name="bodycolor" class="back1" style="background:#99CCFF" value="99CCFF" onblur="changebkclr(this)" maxlength="6">
            </td>
            <td width="16%"  class="td1">亮 边 颜 色</td>
            <td  class="td1" width="16%">
              <input type="text" name="lborderb" class="back1" style="background:#B0D8FF" value="B0D8FF" onblur="changebkclr(this)" maxlength="6">
            </td>
            <td  class="td1" width="16%">暗 边 颜 色</td>
            <td  class="td1" width="16%">
              <input type="text" name="dborderb" class="back1" style="background:#0077FF" value="0077FF" onblur="changebkclr(this)">
            </td>
          </tr>
        </table>
      </td>
    </tr>
    <tr>
      <td class="td1" width="80">菜单  总题目</td>
      <td class="td1" width="85">
        <select name="title" style="width:40" class="back2" onchange="ctrltitle(this)">
          <option value="有">有</option>
          <option value="无" selected>无</option>
        </select>
      </td>
      <td width="95"  class="td1">题目名称</td>
      <td colspan="5"  class="td1">
        <input type="text" name="titlename" class="back2" value="填写总题目" disabled>
      </td>
    </tr>
  </table>
        <div id="itemmenu">
      <table width='700' border='0' align='center' cellpadding='1' cellspacing='1'>
            <tr>
              <td class='td2' width='76'>菜单项目1</td>
              <td colspan='2' class='td2'>
                    <input type='text' name='item1' class='back2' style='width:200' value="菜单1">
              </td>
              <td class='td2' width='173'>菜 单 项 目 内  容  网  页</td><td colspan='2' class='td2'>
                    <input type='file' name='itemsrc1' class='back2' style='width:200'>
              </td>
            </tr>
            <tr>
              <td class='td2' width='76'>菜单项目2</td>
              <td colspan='2' class='td2'>
                    <input type='text' name='item2' class='back2' style='width:200' value="菜单2">
              </td>
              <td class='td2' width='173'>菜 单 项 目 内  容  网  页</td><td colspan='2' class='td2'>
                    <input type='file' name='itemsrc2' class='back2' style='width:200'>
              </td>
            </tr>
    </table>
    </div>
</form>
<div style="display:none">
<textarea name="text1" rows="5" style="width:700" class="back1" readonly>
<html>
<head>
<title>QQ菜单</title>
<meta http-equiv='Content-Type' content='text/html; charset=gb2312'>
<script language='JavaScript'>
</textarea>
<textarea name="text2" rows="5" style="width:700" class="back1" readonly>
var moving = false;
function showme(obj1, obj2)
{
        if (moving)
                return;
        moving = true;
        for(i=0;i<document.all.tags('td').length;i++)
                if (document.all.tags('td')[i].className.indexOf('headtd') == 0)
                        document.all.tags('td')[i].className = 'headtd1';
        obj2.className = 'headtd2';
        moveme(obj1);
}
function moveme(obj)
{
        idnumber = parseInt(obj.id.substr(4));
        objtop = headHeight * (idnumber - 1);
        objbuttom = bodyHeight + headHeight * (idnumber - 2);
        currenttop = parseInt(obj.style.top);
        if (currenttop >= objbuttom)
        {
                countid = 1;
                for(i=0;i<document.all.tags('div').length;i++)
                        if (document.all.tags('div')[i].id == 'item'+countid+'body')
                        {
                                obj = document.all.tags('div')[i];
                                objtop = headHeight * (countid - 1);
                                if (countid == idnumber)
                                {
                                        moveup(obj,objtop,false);
                                        break;
                                }
                                else
                                        moveup(obj,objtop,true);
                                countid++;
                        }
        }
        else if ((currenttop <= objtop) && (idnumber < objcount))
        {
                idnumber++;
                countid = objcount;
                for(i=document.all.tags('div').length-1;i>=0;i--)
                        if (document.all.tags('div')[i].id == 'item'+countid+'body')
                        {
                                obj = document.all.tags('div')[i];
                                objbuttom = bodyHeight + headHeight * (countid - 2);
                                if (countid == idnumber)
                                {
                                        movedown(obj,objbuttom,false);
                                        break;
                                }
                                else
                                        movedown(obj,objbuttom,true);
                                countid--;
                        }
        }
}
function moveup(obj,objtop,ismove)
{
        currenttop = parseInt(obj.style.top);
        if (currenttop > objtop)
        {
                obj.style.top = currenttop - step;
                setTimeout('moveup('+obj.id+','+objtop+','+ismove+')',1)
                return;
        }
        moving = ismove;
}
function movedown(obj,objbuttom,ismove)
{
        currenttop = parseInt(obj.style.top);
        if (currenttop < objbuttom)
        {
                obj.style.top = currenttop + step;
                setTimeout('movedown('+obj.id+','+objbuttom+','+ismove+')',1)
                return;
        }
        moving = ismove;
}
</script>
</script>
<style type='text/css'>
</textarea>
<textarea name="text3" rows="5" style="width:700" class="back1" readonly>

</style>
</head>
<body bgcolor='#FFFFFF' text='#000000'>
</textarea>
</div>
</body>
</html>

CSDN-markdown编辑器

欢迎使用Markdown编辑器写博客本Markdown编辑器使用StackEdit修改而来,用它写博客,将会带来全新的体验哦: Markdown和扩展Markdown简洁的语法 代码块高亮 图片链接和...
  • u011371629
  • u011371629
  • 2017年12月18日 23:50
  • 26

公告:博客Markdown编辑器,带来全新体验

各位亲爱的博主:博客CSDN-Markdown编辑器上线啦!欢迎使用。语法简洁,实现轻松编辑,所见即所得。CSDN-Markdown编辑器使用[StackEdit][6]修改而来,开启博客全新体验! ...
  • csdnproduct
  • csdnproduct
  • 2015年02月06日 10:57
  • 144143

mvc框架嵌入文本编辑器

小编在做组织部项目重构的时候需要在界面中嵌入一个文本编辑器,原来的代码是asp.net版本的,发现原来用的文本编辑器不太好使,所以决定采用itoo新生系统的百度编辑器。在这里把使用的方法分享一下 ...
  • u013046597
  • u013046597
  • 2016年02月21日 23:18
  • 1335

编辑器与编译器详解

首先说下概念 编辑器:说白了就一个类似于text或者office型的编辑工具,只是这个编辑器是针对代码编辑的。 编译器:将你所编辑的源代码编译成机器所能理解的语言,比如VC++把你的.cpp文件编译成...
  • u014492609
  • u014492609
  • 2015年01月04日 17:01
  • 1949

4款好用的开源HTML编辑器

xhEditor开源HTML编辑器 xhEditor是一个基于jQuery开发的简单迷你并且高效的可视化HTML编辑器,基于网络访问并且兼容IE 6.0+,Firefox 3.0+,Opera ...
  • sushauai
  • sushauai
  • 2016年03月21日 19:58
  • 1931

7个最受Linux程序员欢迎的代码编辑器

Linux程序员经常抱怨,自从他们使用了免费开源的系统平台后,作为一名程序员,却并没有在代码编辑器上得到足够的重视。他们往往会认为Linux平台上的代码编辑器太少了,以至于影响他们的编程工作。但是事实...
  • u011596455
  • u011596455
  • 2016年11月20日 11:14
  • 5207

ExtJs 入门教程十四[文本编辑器:Editor]

ExtJs自带的编辑器没有图片上传的功能,大部分时候能够满足我们的需要。 但有时候这个功能还是需要的。我在这里对keeditor进行了整合。 首先要下载keeditor和上传时需要引用的L...
  • u014490157
  • u014490157
  • 2015年09月03日 16:02
  • 336

Qt 实现的文本编辑器

源文件地址:http://yunpan.cn/cjy8H3SW2jUEL  访问密码 0351 需要注意的几点: (1) setWindowIcon(QIcon(":image\\text_c...
  • LT_lover
  • LT_lover
  • 2015年04月28日 22:27
  • 3215

自己制作页面编辑器(js+css)

编辑器都有什么功能。文字加粗,上传图片,改变大小等等。此例仅包含文字加粗和图片上传。 首页你要知道html标签中的contenteditable="true"属性,不知道的自行去百度。(可让div可...
  • u010674395
  • u010674395
  • 2017年03月03日 20:22
  • 1084

Top 10 JavaScript编辑器,你在用哪个?

原文链接:Top 10 JavaScript编辑器,你在用哪个? 对于JavaScript程序员来说,目前有很多很棒的工具可供选择。本文将会讨论10个优秀的支持JavaScript,HTML5和CS...
  • xjlinme
  • xjlinme
  • 2017年06月23日 14:27
  • 929
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:编辑器
举报原因:
原因补充:

(最多只允许输入30个字)