本文實例講述了JS實現iframe編輯器光標位置插入內容的方法。分享給大家供大家參考，具體如下：
<html><iframe id="x" name="x"></iframe><input type="button" onclick="t()" value="test"><input type="button" onclick="frames['x'].location.href='about:blank';" value="clear"><script>//setTimeout('window.frames["x"].document.designMode="On"',200);function t(){window.frames["x"].document.designMode="On";var html = '<b style="color:red">'+$('xx').value+'</b>';//插入的內容(html)，可以是圖片。if(getBrowser()=='ie'){var Editor = window.frames["x"];//IE獲取iframe方法，否則圖片位置跑到頁面頂上去了。Editor.focus();o=Editor.document.selection.createRange();o.pasteHTML(html);}else if(getBrowser()=='chrome'){var Editor = $('x');//firefox要通過這種方式獲取節點才行Editor.focus();//alert(Editor.contentWindow.getSelection().getRangeAt(0));var rng = Editor.contentWindow.getSelection().getRangeAt(0);var frg = rng.createContextualFragment(html);rng.insertNode(frg);}}//獲取瀏覽器版本function getBrowser(){var agentValue = window.navigator.userAgent.toLowerCase();if(agentValue.indexOf('msie')>0){return "ie";}else if(agentValue.indexOf('firefox')>0){return "ff";}else if(agentValue.indexOf('chrome')>0){return "chrome";}}function $(id){return document.getElementById(id);}//根據元素className屬性獲取元素，如果有多個元素樣式類名相同，可以用index指定返回第幾個元素，第一個為1function getNodeByClassName(vclassname,index){//var allnodes = document.all;var allnodes = document.getElementsByTagName("*");var x = 0;for(var i=0;i<allnodes.length;i++){if(allnodes[i].className==vclassname){if(index!="undefined"){x++;if(x<index){continue;}}return allnodes[i];}}}</script>輸入： <input id="xx">更多關于JavaScript相關內容感興趣的讀者可查看本站專題：《JavaScript中json操作技巧總結》、《JavaScript切換特效與技巧總結》、《JavaScript查找算法技巧總結》、《JavaScript動畫特效與技巧匯總》、《JavaScript錯誤與調試技巧總結》、《JavaScript數據結構與算法技巧總結》、《JavaScript遍歷算法與技巧總結》及《JavaScript數學運算用法總結》
希望本文所述對大家JavaScript程序設計有所幫助。
新聞熱點
疑難解答
