PALMisLIFE 討論區

搜索
鹹魚爸魅力四射舞蹈教室
查看: 7647|回復: 12

[分享] [網頁技術] 即見所得編輯器 HTMLArea

[複製鏈接]

3867

主題

126

好友

2623

積分

  • TA的每日心情

    2011-4-12 00:15
  • 簽到天數: 3 天

    連續簽到: 2 天

    [LV.2]偶爾看看I

    文章
    35006
    發表於 2004-8-5 01:22 |顯示全部樓層
    網路上常常需要發言的地方都很讓使用者傷腦筋吧
    HTML 語法很難記

    而且更麻煩的時撰寫時無法知道自己寫的怎麼樣了
    發表之後才發現效果不如預期往往讓人心煩

    要是網路上發表文章也可以像是 Word, FrontPage 一樣該有多好

    注意這篇就要讓網路上的留言版、討論區等加上 即見及所得 的功能
    這篇對網站站長、開發者才有閱讀的需求




    測試網頁 http://www.palmislife.com/~testh/guestbook/yybbs.cgi

    下載如附件
    如果需要原廠網站網址,請自行上 Google 搜尋

    本帖子中包含更多資源

    您需要 登錄 才可以下載或查看,沒有帳號?免費註冊

    3867

    主題

    126

    好友

    2623

    積分

  • TA的每日心情

    2011-4-12 00:15
  • 簽到天數: 3 天

    連續簽到: 2 天

    [LV.2]偶爾看看I

    文章
    35006
    發表於 2004-8-5 01:23 |顯示全部樓層

    Re: [分享] [網頁技術] 即見所得編輯器 HTMLArea

    安裝使用教學

    這篇文章是最基本的安裝教學
    主要是拋磚引玉之用,需要更細節的自訂等功能請參考說明文件或官方網站

    本篇以 HTMLArea 3.0 RC1 為例子
    這是一個免費的 HTML 即見及所得原件,由 Java Script 實現
    目前在 IE 核心瀏覽器以及 FireFox 上都可以正常運行
    若不支援的瀏覽器也絲毫不會影響到正常使用

    下載後直接解壓縮
    將所有檔案 (其實不用全部,不過我懶得說明,就全部吧)

    上傳到網站空間中 (此範例為跟目標檔案同路徑的 htmlarea 資料夾)

    修改發表文章的頁面或是模版
    注意這個原件針對的是表單中的文件區域 (textarea)


    在 Head 標題中加入

    1. <script type="text/javascript">
    2.    _editor_url = "htmlarea/";
    3.    _editor_lang = "b5";
    4. </script>

    5. <script type="text/javascript" src="htmlarea/htmlarea.js"></script>

    6. <script type="text/javascript" defer="1">
    7.     HTMLArea.replaceAll();
    8. </script>
    複製代碼


    這樣該頁面中所有的文字發表區域就會套用即見及所得編輯器了
    另外要注意的是建議將 textarea 的列數建議 + 7 因為工具列需要一定額外的空間

    修改備註:上面的原始碼中

    1. _editor_url = "htmlarea/";

    2. src="htmlarea/htmlarea.js
    複製代碼


    這兩個要注意你檔案實際的相對路徑
    回復

    使用道具 舉報

    3867

    主題

    126

    好友

    2623

    積分

  • TA的每日心情

    2011-4-12 00:15
  • 簽到天數: 3 天

    連續簽到: 2 天

    [LV.2]偶爾看看I

    文章
    35006
    發表於 2004-8-5 01:42 |顯示全部樓層

    Re: [分享] [網頁技術] 即見所得編輯器 HTMLArea

    如果不要全部的 textarea 都加入的話
    也可以個別加入

    例如我有 text1 跟 text2 兩個 textarea 要加入 HTMLArea

    則就是將上面的

    1. <script type="text/javascript" defer="1">
    2.     HTMLArea.replaceAll();
    3. </script>
    複製代碼


    修改為

    1. <script type="text/javascript" defer="1">
    2.     HTMLArea.replace("text1");
    3.     HTMLArea.replace("text2");
    4. </script>
    複製代碼


    這樣子就行了,要更多更少就一樣類推
    阿輝攝影記錄服務 | 婚禮記錄 | 活動拍攝
    http://www.giorno.tw/
    回復

    使用道具 舉報

    71

    主題

    0

    好友

    709

    積分

    該用戶從未簽到

    文章
    675
    發表於 2004-8-5 02:39 |顯示全部樓層

    Re: [分享] [網頁技術] 即見所得編輯器 HTMLArea

    不知道為什麼我的Mozilla Firefox 0.9上無法顯示
    這個功能真是太好了,是很多沒學過html的使用者的福音
    能解決的事,不必去擔心;不能解決的事,擔心也沒用
    回復

    使用道具 舉報

    43

    主題

    0

    好友

    818

    積分

    免錢的最貴

    該用戶從未簽到

    文章
    660
    發表於 2004-8-5 09:18 |顯示全部樓層

    Re: [分享] [網頁技術] 即見所得編輯器 HTMLArea

    Originally posted by poky at 2004-8-5 02:39 AM:
    不知道為什麼我的Mozilla Firefox 0.9上無法顯示
    這個功能真是太好了,是很多沒學過html的使用者的福音


    Firefox 瀏覽真的怪怪的~

    [ Last edited by risumfiriri on 2004-8-5 at 09:23 ]
    回復

    使用道具 舉報

    293

    主題

    0

    好友

    2300

    積分

    Johnny Joker

  • TA的每日心情
    無聊
    2012-7-5 13:24
  • 簽到天數: 1 天

    連續簽到: 1 天

    [LV.1]初來乍到

    文章
    1910
    發表於 2004-8-5 10:17 |顯示全部樓層

    Re: [分享] [網頁技術] 即見所得編輯器 HTMLArea

    神呀~請接受小弟膜拜

    好優的工具~~對咱們網站捆工真是一大好物呀!|)
    回復

    使用道具 舉報

    27

    主題

    0

    好友

    1938

    積分

  • TA的每日心情
    開心
    2011-4-9 04:43
  • 簽到天數: 1 天

    連續簽到: 0 天

    [LV.1]初來乍到

    文章
    2066
    發表於 2004-8-5 11:25 |顯示全部樓層

    Re: [分享] [網頁技術] 即見所得編輯器 HTMLArea

    看來大概是vb script寫的,mozilla不吃...
    回復

    使用道具 舉報

    169

    主題

    0

    好友

    4260

    積分

    該用戶從未簽到

    文章
    5723
    發表於 2004-8-5 17:43 |顯示全部樓層

    Re: [分享] [網頁技術] 即見所得編輯器 HTMLArea

    Originally posted by ychao at 2004-8-5 11:25 AM:
    看來大概是vb script寫的,mozilla不吃...

    不是啦,看清楚喔,阿輝範例的語法所呼叫的是 JavaScript 啊,
    在 IE 裡頭,就算不指定是哪一種 Script ,預設也是 JavaScript 的。
    ( IE 的話應該叫做 JScript 就是了)
    - 自以為是新手所以被排擠,是成為白爛的開始。
    - 自以為了不起,是大犯眾怒的開始。
    - 強調問題笨或自己笨,是最笨的發問方式。

    回復

    使用道具 舉報

    104

    主題

    4

    好友

    1429

    積分

    羊毛大亨

    該用戶從未簽到

    文章
    1533
    發表於 2004-8-6 12:50 |顯示全部樓層

    Re: [分享] [網頁技術] 即見所得編輯器 HTMLArea

    真傷腦筋! 遇到這個問題:
    http://www.interactivetools.com/ ... search_engine#24964
    alert:
    'HTMLArea.I18N.msg.Path' empty or not an object  
    'this._doc.body' empty or not an object

    不知道問題在哪說 ...
    回復

    使用道具 舉報

    29

    主題

    0

    好友

    217

    積分

    該用戶從未簽到

    文章
    222
    發表於 2004-8-6 13:16 |顯示全部樓層

    Re: [分享] [網頁技術] 即見所得編輯器 HTMLArea

    在 Head 標題中加入

    1. <script type="text/javascript">
    2.    _editor_url = "htmlarea/";
    3.    _editor_lang = "b5";
    4. </script>
    複製代碼


    若去看htmlarea/lang/b5.js這個檔,好像是作者把之前2.0版本的中文化直接放進去,沒有做更新。測試的時候,都會一直出現error。若想要費點功夫的話,就把en.js自行中文化吧~或是參考小弟的自己中文化的結果(如後)

    另外,小弟也碰到下面兩個問題(後來克服了,解決方案也在其中)
    一、在你的網頁原始檔裡面,千萬不能把&lt;textarea&gt;&lt;/textarea&gt;擺在&lt;p&gt;&lt;/p&gt;中間,否則會碰到莫名其妙的錯誤訊息

    二、因為小弟是用ASP.net寫的,系統預設都是utf-8編碼,沒想到b5.js這個檔案是ANSI、BIG5編碼... 結果一開始網頁檢視就有問題,我把.aspx這個檔的content type改成big5時,雖然網頁檢視變正常,但把使用者傳入的值再讀出來時,卻變成一堆亂碼。搞了很久,後來用記事本把b5.js打開,再另存成UNICODE編碼,再把.aspx改回成utf-8即可。

    再加個小PS:.aspx記得要在原始碼一開始時加上validateRequest=false,否則.net又會跟你鬧小脾氣嚕...

    [ Last edited by sunflier on 2004-8-6 at 13:19 ]

    本帖子中包含更多資源

    您需要 登錄 才可以下載或查看,沒有帳號?免費註冊

    回復

    使用道具 舉報

    43

    主題

    0

    好友

    751

    積分

    該用戶從未簽到

    文章
    829
    發表於 2004-8-6 20:55 |顯示全部樓層

    Re: [分享] [網頁技術] 即見所得編輯器 HTMLArea

    請教一下輝兄,您的 YY-Board 留言板是否有另外修改,
    將過濾 HTML 標籤的程式碼給移除 (或註解) 掉呢?
    因為我發現 YY-Board 加入 HTMLArea 後,雖然編輯時所見即所得,
    不過送出之後文章內容都是 HTML 原始碼... ^ ^"
    謝謝指教!
    回復

    使用道具 舉報

    3867

    主題

    126

    好友

    2623

    積分

  • TA的每日心情

    2011-4-12 00:15
  • 簽到天數: 3 天

    連續簽到: 2 天

    [LV.2]偶爾看看I

    文章
    35006
    發表於 2004-8-6 22:40 |顯示全部樓層

    Re: [分享] [網頁技術] 即見所得編輯器 HTMLArea

    yy 可以打開 html 支援
    在 yybbs 中有選項可以選擇開啟 html 語法

    這情況當然是要打開..

    Originally posted by FireHouse at 2004-8-6 08:55 PM:
    請教一下輝兄,您的 YY-Board 留言板是否有另外修改,
    將過濾 HTML 標籤的程式碼給移除 (或註解) 掉呢?
    因為我發現 YY-Board 加入 HTMLArea 後,雖然編輯時所見即所得,
    不過送出之後文章內容都是 HTML 原始碼... ^ ^"
    謝謝指教!
    阿輝攝影記錄服務 | 婚禮記錄 | 活動拍攝
    http://www.giorno.tw/
    回復

    使用道具 舉報

    43

    主題

    0

    好友

    751

    積分

    該用戶從未簽到

    文章
    829
    發表於 2004-8-7 06:13 |顯示全部樓層

    Re: [分享] [網頁技術] 即見所得編輯器 HTMLArea

    Originally posted by 阿輝 at 2004-8-6 10:40 PM:
    yy 可以打開 html 支援
    在 yybbs 中有選項可以選擇開啟 html 語法

    這情況當然是要打開..


    印象中也是有... 不過就是找不到,
    查了半天,發現原來我用的是 5.32 版,根據作者的更新紀錄,
    已經把 HTML 語法開啟或關閉的設定選項給拿掉了... ^ ^"
    只好手動把轉碼的地方找出來註解掉.. .
    謝謝阿輝的答覆!

    另外,發現測試的留言板在回覆留言的表單內,
    並未出現 HTMLArea 的編輯界面,必須重新整理後才會出現...

    可以使用
    1. <body onload="HTMLArea.replaceAll()"...>
    複製代碼
    來取代下列語法,就正常了:
    1. <script type="text/javascript" defer="1">
    2.    HTMLArea.replaceAll();
    3. </script>
    複製代碼

    [ Last edited by FireHouse on 2004-8-7 at 14:47 ]
    回復

    使用道具 舉報

    您需要登錄後才可以回帖 登錄 | 免費註冊

    與站長聯繫| PALMisLIFE 掌上生活      下載:更快、更棒、更好玩

    GMT+8, 2024-3-29 23:58 , Processed in 0.064560 second(s), 32 queries , Gzip On.

    Powered by Discuz!

    © 2001-2012 Comsenz Inc. style by eisdl

    回頂部