Avatar billede jensen_123 Nybegynder
11. april 2003 - 13:10 Der er 1 kommentar og
1 løsning

WYSIWYG med database?????

<html>

<head
><STYLE>

A:hover { font-family: verdana,arial,sans-serif; font-size: 10pt; font-weight: bold; color: #9933FF; text-decoration: bold; background-color: #66FFFF } A { font-family: verdana,arial,sans-serif; font-size:10pt; font-weight:bold; color:#FF0000; text-decoration: } 

{

</STYLE>

<title></title>

<script language="JavaScript">



  var viewMode = 1; // WYSIWYG



  function Init()

  {

    iView.document.designMode = 'On';

  }

 

  function selOn(ctrl)

  {

    ctrl.style.borderColor = '#000000';

    ctrl.style.backgroundColor = '#B5BED6';

    ctrl.style.cursor = 'hand';   

  }

 

  function selOff(ctrl)

  {

    ctrl.style.borderColor = '#D6D3CE'; 

    ctrl.style.backgroundColor = '#D6D3CE';

  }

 

  function selDown(ctrl)

  {

    ctrl.style.backgroundColor = '#8492B5';

  }

 

  function selUp(ctrl)

  {

    ctrl.style.backgroundColor = '#B5BED6';

  }

   

  function doBold()

  {

    iView.document.execCommand('bold', false, null);

  }



  function doItalic()

  {

    iView.document.execCommand('italic', false, null);

  }



  function doUnderline()

  {

    iView.document.execCommand('underline', false, null);

  }

 

  function doLeft()

  {

    iView.document.execCommand('justifyleft', false, null);

  }



  function doCenter()

  {

    iView.document.execCommand('justifycenter', false, null);

  }



  function doRight()

  {

    iView.document.execCommand('justifyright', false, null);

  }



  function doOrdList()

  {

    iView.document.execCommand('insertorderedlist', false, null);

  }



  function doBulList()

  {

    iView.document.execCommand('insertunorderedlist', false, null);

  }

 

  function doForeCol()

  {

    var fCol = prompt('Enter foreground color', '');

   

    if(fCol != null)

      iView.document.execCommand('forecolor', false, fCol);

  }



  function doBackCol()

  {

    var bCol = prompt('Enter background color', '');

   

    if(bCol != null)

      iView.document.execCommand('backcolor', false, bCol);

  }



  function doLink()

  {

    iView.document.execCommand('createlink');

  }

 

  function doImage()

  {

    var imgSrc = prompt('Enter image location', '');

   

    if(imgSrc != null)   

    iView.document.execCommand('insertimage', false, imgSrc);

  }

 

  function doRule()

  {

    iView.document.execCommand('inserthorizontalrule', false, null);

  }

 

  function doFont(fName)

  {

    if(fName != '')

      iView.document.execCommand('fontname', false, fName);

  }

 

  function doSize(fSize)

  {

    if(fSize != '')

      iView.document.execCommand('fontsize', false, fSize);

  }

 

  function doHead(hType)

  {

    if(hType != '')

    {

      iView.document.execCommand('formatblock', false, hType); 

      doFont(selFont.options[selFont.selectedIndex].value);

    }

  }

 

  function doToggleView()

  { 

    if(viewMode == 1)

    {

      iHTML = iView.document.body.innerHTML;

      iView.document.body.innerText = iHTML;

     

      // Hide all controls

      tblCtrls.style.display = 'none';

      selFont.style.display = 'none';

      selSize.style.display = 'none';

      selHeading.style.display = 'none';

      iView.focus();

     

      viewMode = 2; // Code

    }

    else

    {

      iText = iView.document.body.innerText;

      iView.document.body.innerHTML = iText;

     

      // Show all controls

      tblCtrls.style.display = 'inline';

      selFont.style.display = 'inline';

      selSize.style.display = 'inline';

      selHeading.style.display = 'inline';

      iView.focus();

     

      viewMode = 1; // WYSIWYG

    }

  }



</script>

<style>



  .butClass

  {   

    border: 1px solid;

    border-color: #9999FF;

  }

 

  .tdClass

  {

    padding-left: 3px;

    padding-top:3px;

  }



</style>



<body onLoad="Init()">
<BODY>
<CENTER>
<BR>
    <table id="tblCtrls" width="545px" height="30px" border="0" cellspacing="0" cellpadding="0" bgcolor="#D6D3CE">   

    <tr>

        <td class="tdClass">

            <img alt="Bold" class="butClass" src="images/bold.gif" onMouseOver="selOn(this)" onMouseOut="selOff(this)" onMouseDown="selDown(this)" onMouseUp="selUp(this)" onClick="doBold()">

            <img alt="Italic" class="butClass" src="images/italic.gif" onMouseOver="selOn(this)" onMouseOut="selOff(this)" onMouseDown="selDown(this)" onMouseUp="selUp(this)" onClick="doItalic()">

            <img alt="Underline" class="butClass" src="images/underline.gif" onMouseOver="selOn(this)" onMouseOut="selOff(this)" onMouseDown="selDown(this)" onMouseUp="selUp(this)" onClick="doUnderline()">

           

            <img alt="Left" class="butClass" src="images/left.gif" onMouseOver="selOn(this)" onMouseOut="selOff(this)" onMouseDown="selDown(this)" onMouseUp="selUp(this)" onClick="doLeft()">

            <img alt="Center" class="butClass" src="images/center.gif" onMouseOver="selOn(this)" onMouseOut="selOff(this)" onMouseDown="selDown(this)" onMouseUp="selUp(this)" onClick="doCenter()">

            <img alt="Right" class="butClass" src="images/right.gif" onMouseOver="selOn(this)" onMouseOut="selOff(this)" onMouseDown="selDown(this)" onMouseUp="selUp(this)" onClick="doRight()">

                       

            <img alt="Ordered List" class="butClass" src="images/ordlist.gif" onMouseOver="selOn(this)" onMouseOut="selOff(this)" onMouseDown="selDown(this)" onMouseUp="selUp(this)" onClick="doOrdList()">

            <img alt="Bulleted List" class="butClass" src="images/bullist.gif" onMouseOver="selOn(this)" onMouseOut="selOff(this)" onMouseDown="selDown(this)" onMouseUp="selUp(this)" onClick="doBulList()">

           

            <img alt="Text Color" class="butClass" src="images/forecol.gif" onMouseOver="selOn(this)" onMouseOut="selOff(this)" onMouseDown="selDown(this)" onMouseUp="selUp(this)" onClick="doForeCol()">

            <img alt="Background Color" class="butClass" src="images/bgcol.gif" onMouseOver="selOn(this)" onMouseOut="selOff(this)" onMouseDown="selDown(this)" onMouseUp="selUp(this)" onClick="doBackCol()">

           

            <img alt="Hyperlink" class="butClass" src="images/link.gif" onMouseOver="selOn(this)" onMouseOut="selOff(this)" onMouseDown="selDown(this)" onMouseUp="selUp(this)" onClick="doLink()">

            <img alt="Image" class="butClass" src="images/image.gif" onMouseOver="selOn(this)" onMouseOut="selOff(this)" onMouseDown="selDown(this)" onMouseUp="selUp(this)" onClick="doImage()">

            <img alt="Horizontal Rule" class="butClass" src="images/rule.gif" onMouseOver="selOn(this)" onMouseOut="selOff(this)" onMouseDown="selDown(this)" onMouseUp="selUp(this)" onClick="doRule()">

        </td>

    </tr>

    </table>

    <iframe id="iView" style="width: 545px; height:375px"></iframe>



    <table width="545px" height="30px" border="0" cellspacing="0" cellpadding="0" bgcolor="#D6D3CE">   

    <tr>

        <td class="tdClass" colspan="1" width="80%">

          <select name="selFont" onChange="doFont(this.options[this.selectedIndex].value)">

            <option value="">-- Font --</option>

            <option value="Arial">Arial</option>

            <option value="Courier">Courier</option>

            <option value="Sans Serif">Sans Serif</option>

            <option value="Tahoma">Tahoma</option>

            <option value="Verdana">Verdana</option>

            <option value="Wingdings">Wingdings</option>

          </select>

          <select name="selSize" onChange="doSize(this.options[this.selectedIndex].value)">

            <option value="">-- Size --</option>

            <option value="1">Very Small</option>

            <option value="2">Small</option>

            <option value="3">Medium</option>

            <option value="4">Large</option>

            <option value="5">Larger</option>

            <option value="6">Very Large</option>

          </select>

          <select name="selHeading" onChange="doHead(this.options[this.selectedIndex].value)">

            <option value="">-- Heading --</option>

            <option value="Heading 1">H1</option>

            <option value="Heading 2">H2</option>

            <option value="Heading 3">H3</option>

            <option value="Heading 4">H4</option>

            <option value="Heading 5">H5</option>

            <option value="Heading 6">H6</option>

          </select>

        </td>

        <td class="tdClass" colspan="1" width="20%" align="right">

          <img alt="Toggle Mode" class="butClass" src="images/mode.gif" onMouseOver="selOn(this)" onMouseOut="selOff(this)" onMouseDown="selDown(this)" onMouseUp="selUp(this)" onClick="doToggleView()">

          &nbsp;&nbsp;&nbsp;

        </td>

    </tr>

    </table>

</body>

</html>


Spørgsmål:

Er det muligt at sætte en database på dette script. Så man kan hendte information ind i scriptet og gemme det igen?? Eller skal jeg bruge et andet script til dette ???
Avatar billede jensen_123 Nybegynder
11. april 2003 - 16:26 #1
Avatar billede amd Nybegynder
11. april 2003 - 20:55 #2
Du skal lige huske at acceptere dit svar ;)
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Kurser inden for grundlæggende programmering

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester