[zt]客服端的HTMLdecode和HTMLencode—in javascript

來源:互聯網
上載者:User

今天碰到一個問題,在要通過ajax實現分頁,需要對ajaxMethod返回的Html代碼端重新組裝,一段是分頁,另一段是查詢的結果,這樣問題就來,如何分離這兩端代碼?我想到的辦法就是在ajaxMethod裡構造一個javascript對象,把這兩段代碼加到對象的屬性值中如此模樣

“//construct javascript object
var objHTML = new Object();
objHTML.firstSection = ?;
objHTML.secondSection = ?;
"

然後在前台的callback函數中通過eval(strCode)構造返回的javascript對象,接下來更新相應的HTML塊就非常簡單啦。
在我替換上面代碼中的問號處,本來是換上兩段HTML代碼塊字串就可以啦,但我想如果在這裡給他們加上encode,那麼在前台如何decode呢,我試了在後台加上Server.URLEncode(strHtml),前台需要套uridecode()和unecape(),但裡面的空格還是‘+’,在加一個replace(/\+/g,' ')就可以搞定啦,這樣潛在的一個問題就是如果內容裡面本來就有'+'會有問題的,於是我在網上搜了一下看看有沒有更好的解決辦法,結果發現一種很巧的辦法,用HTML中的容器來實現。
javascript HTMLencode實現:function HTMLEncode(strHTML)
{
var div = document.createElement('div');
div.innerText = strHTML;
return div.innerHTML;
}

javascript HTMLdecode實現:function HTMLDecode(strEncodeHTML)
{
var div = document.createElement('div');
div.innerHTML = strEncodeHTML;
return div.innerText;
}

這樣實現很方便簡單,下面是範例程式碼供參考<script type="text/javascript">
function HTMLEncode(strHTML)
{
var div = document.createElement('div');
div.innerText = strHTML;
return div.innerHTML;
}
function HTMLDecode(strEncodeHTML)
{
var div = document.createElement('div');
div.innerHTML = strEncodeHTML;
return div.innerText;
}
function test1()
{
var strInput = prompt('test HTMLEncode(),please input decodeHTML','<div style=\"width:600px;\"><input type=\"button\" name=\"runStart\" value=\"View\" onclick=\"Run()\" style=\"margin-left:2px;\" /><input type=\"button\" name=\"runStart\" value=\"RunScript\" onclick=\"RunScript()\" style=\"margin-left:10px;\" /><input type=\"button\" name=\"reset\" value=\"Clear\" onclick=\"Reset()\" style=\"margin-left:18px;\" /><span onclick=\"ExpandCollapse(this);\" onmouseover=\"showMsg();\" onmouseout=\"hideMsg();\" msg=\"expand\" style=\"font-family:webdings;font-size:18pt;cursor:pointer;\">5</span></div><iframe name=\"ifrShow\" style=\"margin:0px;margin:0px;width:600px;height:400px;border:1px orange solid;\"></iframe><div id=\"divMsg\" style=\"display:none\"></div>');
alert(HTMLEncode(strInput));
}
function test2()
{
var strInput=prompt('test HTMLDecode(),please input encodeHTML','&lt;div style="width:600px;"&gt;&lt;input type="button" name="runStart" value="View" onclick="Run()" style="margin-left:2px;"&gt;&lt;input type="button" name="runStart" value="RunScript" onclick="RunScript()" style="margin-left:10px;"&gt;&lt;input type="button" name="reset" value="Clear" onclick="Reset()" style="margin-left:18px;"&gt;&lt;span onclick="ExpandCollapse(this);" onmouseover="showMsg();" onmouseout="hideMsg();" msg="expand" style="font-family:webdings;font-size:18pt;cursor:pointer;"&gt;5&lt;/span&gt;&lt;/div&gt;&lt;iframe name="ifrShow" style="margin:0px;margin:0px;width:600px;height:400px;border:1px orange solid;"&gt;&lt;/iframe&gt;&lt;div id="divMsg" style="display:none"&gt;&lt;/div&gt;');
alert(HTMLDecode(strInput));
}
</script><button onclick="test1();">test HTMLEncode</button>
<button onclick="test2();">test HTMLDecode</button>  

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.