对所选文件加红

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html xmlns:v="urn:schemas-microsoft-com:vml">
<STYLE>
v\:*{Behavior: url(#default#VML)}

</STYLE>
<body onselectstart="return false" oncontextmenu="window.event.returnValue=false" onmouseup=main_mouseup1()>
<v:rect id=selRect onmousemove=main_mousemove() style="DISPLAY: none;Z-INDEX: 255; POSITION: absolute;" coordsize =
"21600,21600" strokecolor = "#088008"><v:fill opacity = "0"></v:fill></v:rect>
<script>
canChange = 1;
var candraw = 1;
/*
function main_mousedown(){
//显示
candraw = true;
selRect.style.display="";
//alert(f1.width);
//alert(event.x);
selRect.style.posLeft=event.x
selRect.style.posTop=event.y
selRect.style.posWidth=selRect.style.posHeight=0
}function main_mousemove(){
if(selRect.style.display==""){
  if(candraw == true){
  selRect.style.posWidth=event.x-selRect.style.posLeft
  selRect.style.posHeight=event.y-selRect.style.posTop
}
}
}
*/
/*
function main_mouseup()
{
candraw = false;
selRect.style.posLeft=-1;
selRect.style.posTop=-1;
selRect.style.posWidth=selRect.style.posHeight=0
selRect.style.display="none";
}
*/
function main_mouseup1()
{
  candraw = 0;
}
function init()
{

var aDivs = document.getElementsByTagName("div");
for (var i=0; i<aDivs.length; i++) {
  new neverDragDivision(aDivs[i]);
}
}function changeColorToSelected(id)
{
id1=""+id;
var td =document.getElementById(id1);
td.bgColor = "#0000C6";
}

function changeColorToNotSelected(id)
{
id1=""+id;
var td =document.getElementById(id1);
td.bgColor = "#BEBEBE";
}
function changecolor(id)
{
if(canChange == 1)
{
  if(id<1000)
        {
id1=""+id;
var td =document.getElementById(id1);

var str = td.bgColor;
//alert(str);
var str1 = "#bebebe";  //黑色
var str2 = "#008000";  //绿色
if(str == str1)
{
   td.bgColor = "#0000C6";   //red说明这个位置可以放！
  // ps[id] = 1;
}
else
{
//ps[id] = 0;
td.bgColor = "#BEBEBE";
}
}
else
{
  id1=""+id;
  var td =document.getElementById(id1);
  var str = td.bgColor;
  var str2 = "#008000";  //绿色
         if(str == str2)
        {
           td.bgColor = "white";
            isHasChang=0;           //说明没有舱盖板
        }
        else td.bgColor = "green";
        {
          isHasChang=1;
        }
}
}}
var startId;
var endId;
var list = 5;
var up = 5;
var down = 6;
var selectFun = 0;
function changeStart(id)
{
candraw = 1;
switch(event.button)
{
  case 1: selectFun = 0; break;
  case 2: selectFun = 1; break;
}
//获得鼠标按下的那个格子的ID，来确定是哪个格子
//alert('start');
startId = id;

}function changeColorBySE(id1,id2)
{
var Sx,Sy,Ex,Ey;
var startP; //the last start point
var endP;  //the end point
var changeId;
Sx = id1%list;
Sy = Math.floor(id1/list);
//alert(Sy);
  Ex = id2%list;
Ey = Math.floor(id2/list);
DisX = Math.abs(Sx-Ex);  //差距为几列
//alert("DisX:"+DisX);
DisY = Math.abs(Sy-Ey);  //差距为几行
//alert("DisY:"+DisY);
//这个函数功能是将所有的矩形开始结束全部转变为左上右下
function StartChange(id1,id2)
{

  if((id1<id2) && (id1%list<id2%list)) {startP = id1;endP = id2;}
  else if((id1>id2) && (id1%list>id2%list)) {startP = id2;endP = id1;}
  else{
   //alert(DisY);
   startP = (id1<id2)?(id1-DisX):(id2-DisX);
   endP = (id1<id2)?(id2+DisY):(id1+DisY);
  }
  //alert("startP:"+startP+"endP:"+endP);
}
//开始点在结束点的下面
//转换包含(Sx,Sy),(Ex,Ey)区域的颜色
StartChange(id1,id2);

  for(i=0;i<DisY+1;i++)
  {
  for(j=0;j<DisX+1;j++)
{
    changeId = startP+j+i*list;
    //alert(changeId);
    selectFun == 0?changeColorToSelected(changeId):changeColorToNotSelected(changeId);
   }
} //alert(Sx);
}function changUpEnd()
{
candraw = 0;
}function changeEnd(id)
{
//获得了最后的一个格子。
if(candraw == 1){
endId = id;
//alert(endId);
//算法
/*
  *根据起始ID 和最后ID来确定是哪些格子变
  * 计算start和end的行，列数
  */
  changeColorBySE(startId,endId);
}
}function show()
{
a = Math.abs(-5);
b=4;
startP = a>b?3:6;
//alert(startP);
}</script>
<SCRIPT LANGUAGE="JavaScript">

</SCRIPT>
<script>
document.write('<table border="0" align="center">');
document.write('<td>');
document.write('仿C/S的变色方法左键按下拖拉变蓝，右健按下拖拉变灰 written by wwl 20060615');
document.write('</td>');
document.write('</table>');
document.write('<table border="0" align="center">');
document.write('<br>');
document.write('<br>');
document.write('<br>');
document.write('<br>');
document.write('<tr>');
document.write('<td>');
document.write('    ');
document.write('</td>');
number=1;
number1=1;
var i;
up=5;
list=5;
for(i=0;i<(up*list);i++)
{
  document.write('<td width="30" height="30" bgColor="#BEBEBE" id="'+i+'" onmouseMove="changeEnd(parseInt(id))" onmouseUp="changUpEnd()" onmouseDown="changeStart(parseInt(id))" onclick="changecolor(parseInt(id))")></td>');
if((i<((up*list)-list)) && (i+1)%list==0)
{
  document.write('</tr><tr>');
  document.write('<td>');
    document.write('    ');
    document.write('</td>');
  number++;
}
}
    document.write('</tr><tr>');
  document.write('<td>');
  document.write('</td>');
document.write('</tr></table>');
</script>
</body>
</html>

IE7 FF3.5 下测试通过<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
  <TITLE> New Document </TITLE>
  <META NAME="Generator" CONTENT="EditPlus">
  <META NAME="Author" CONTENT="">
  <META NAME="Keywords" CONTENT="">
  <META NAME="Description" CONTENT="">
</HEAD> <BODY>
<div id="selText">中华人民共和国</div>
</BODY>
</HTML>
<SCRIPT LANGUAGE="JavaScript">

</SCRIPT>

<SCRIPT LANGUAGE="JavaScript">

</SCRIPT>

参考下吧，IE是可以的，FF下我的FF3.5版本的程序有问题，测试出错，这个错误是FF的问题。但是暂未找到原因，错误已经alert出来了。
具体可以参考：
http://www.quirksmode.org/dom/execCommand/<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<HTML>
<HEAD>
  <TITLE> New Document </TITLE>
  <META NAME="Generator" CONTENT="EditPlus">
  <META NAME="Author" CONTENT="">
  <META NAME="Keywords" CONTENT="">
  <META NAME="Description" CONTENT="">
</HEAD> <BODY>
<div id="selText">中华人民共和国共和国人民</div>
</BODY>
</HTML>
<SCRIPT LANGUAGE="JavaScript">

</SCRIPT>

发一个来玩玩~
<div id="dvCT">中国人民共和国共和</div>
<input type="button" value="清除颜色" onclick="$('dvCT').innerHTML=removeHTML($('dvCT').innerHTML)" />
<script language="javascript">
function $(Id){return document.getElementById(Id);}
function removeHTML(v){return v.replace(/<[^>]+>/g,'');}
document.onmouseup=function(){
  var isIE=!!document.all;
  if(isIE){
    var rng=document.selection.createRange();
    if(rng.text!='')rng.pasteHTML(rng.text.fontcolor('#ff0000'));
  }
  else{
    var s=window.getSelection();
    if(s.toString()!=''){
       var font=document.createElement('font');
       font.color='#ff0000';font.innerHTML=s;
       s.getRangeAt(0).surroundContents(font);
       s.removeAllRanges();
    }
  }
}
</script>

呵呵~~
这个见到过
var rng=document.selection.createRange();
if(rng.text!='')rng.pasteHTML(rng.text.fontcolor('#ff0000'));
else的不会
学习了

动态增加样式用replace函数

调试易

对所选文件加红

解决方案 »