DOFI-BLOG どふぃぶろぐ

<script language="JavaScript"><!--

function search(str){

  document.getElementById("view").innerHTML=document.getElementById("original").innerHTML;
  document.getElementById("original").style.display="none";
  
  if(str.length==0)
    return;
  
    var reg=new RegExp("("+str+")", "g");
    var elems=document.getElementById("view").getElementsByTagName("div");
    for(var i=0; i<elems.length; ++i){
        if(elems[i].className=="mark"){
          var elem=elems[i].getElementsByTagName("div")[0];
          if(elem.innerHTML.match(reg)){
            elem.innerHTML=elem.innerHTML.replace(reg,'<u><font color="red">$1</font></u>');
          }else{
             elems[i].style.display="none";
          }
       }
    }
}


//-->
</script>

<script language="JavaScript"><!--

function view(){
  var ret;
  
  if(document.form.kind[0].checked){  //「普通に話す」にチェック付けてる場合

    document.form.txt.style.backgroundColor="#ffffff";
    ret='<div style="background: #fff; color: #000;">';

  }else if(document.form.kind[1].checked){  //「独り言」にチェック付けてる場合

    document.form.txt.style.backgroundColor="#777777";
    ret='<div style="background: #777; color: #000;">';

  }else{//「狼の囁き」にチェック付けてる場合

    document.form.txt.style.backgroundColor="#ff7777";
    ret='<div style="background: #f77; color: #000;">';

  }

  //テキストエリアの文字列を変換する。
  //ret+=ln2br(escape_html(chop(document.form.txt.value))); 
  ret+=ln2br(escape_html(document.form.txt.value)); //今回は文字数制限を外す。

  //タグを閉じる。
  ret+='</div>'; 
  
  //<div id="preview"></div> 
  //というidが"preview"というタグを探し、その内部のHTMLを置き換える。
  document.getElementById("preview").innerHTML=ret; 
}

//改行文字を<br/>に置き換える。
function ln2br(str){
  return str.replace(/\n/g,"<br/>");
}

//HTML的に意味のある文字をエスケープする。
function escape_html(str){
  var i,j;
  var ret = "";
  var from = "&\"<>";
  var to = ["&amp;","&quot;","&lt;","&gt;"];
  for(i = 0; i<str.length; ++i){
    var c = str.charAt(i);
    for(j = 0; j<from.length; ++j){
        if(from.charAt(j)==c){
          c = to[j];
          break;
        }
    }
    ret += c;
  }
  return ret;
}

//文字列を200文字以内、改行5以内に切り詰める。
function chop(str){
  var ret="";
  var count=0;
  var lncount=0;
  for(i = 0; i<str.length && count<200 && lncount<5; ++i){
    var c = str.charAt(i);
    ret+=c;
    if(c<128){
      if(c=='\n'){
        lncount++;
      }
      count++;
    }else{
      count+=2;
    }
  }
  return ret;
}

//-->
</script>

<div id="preview"><!--ここに挿入される。--></div>

<br/><br/>

<form name="form">
<input type="radio" name="kind" onclick="view();">普通に話す  
<input type="radio" name="kind" onclick="view();">独り言
<input type="radio" name="kind" onclick="view();" checked>狼の囁き</br>
<textarea name="txt" rows="5" cols="60" onkeyup="view();" style="background-color: #ff7777">
</textarea>
</form>