html5 - 這個代碼顯示功能如何實現?
問題描述
我想知道,左邊是html +js ,右邊顯示,這樣的網頁是怎樣做到的?它的原理是什么?
我下載了wp fiddle,發現不能用在我最新版本的wordpress,想自己實現。
提交代碼的時候,觸發了一個submitTryit() 函數,這個函數倒很簡單
function submitTryit(){var t=document.getElementById('TestCode').value;t=t.replace(/=/gi,'w3equalsign');t=t.replace(/script/gi,'w3scrw3ipttag');document.getElementById('code').value=t;document.getElementById('tryitform').action='v.asp';validateForm();document.getElementById('tryitform').submit();}function validateForm(){var code=document.getElementById('code').value;if (code.length>5000) { document.getElementById('code').value='<h1>Error</h1>'; }}
問題解答
回答1:左邊是一個表單。書寫代碼,右邊是iframe,左邊代碼form的target設為右邊iframe即可
回答2:這個頁面使用了iframe,見下圖
左邊p#contenteditable,右邊p.html(contenteditable.html())不行么?
相關文章:
1. html5 - iframe src可以引入其他域名或者IP吧iframe src可以是其他域名過IP吧2. web前端頁面中實現表格效果,這個表格是可編輯的3. javascript - 為什么scroll事件阻止不了冒泡?4. javascript - UI樣式計算過多導致瀏覽器加載過慢,IE尤其嚴重,求前輩指導5. javascript - 關于ajax異步的問題6. css3 - Css 字型加載7. javascript - 函數返回值要經過內部方法的回調函數處理,該怎么寫?8. python - Django表單Form.save()問題9. javascript - easyui combobox,valueField顯示的問題10. javascript - 請問在style樣式里寫了{{數據綁定}},當數據變更時,外觀樣式會自動即時刷新嗎?這時應用style還是ng-style?

網公網安備