主题: 在做个查找替换的功能,只实现了IE的,非IE搞不出来,希望高手能指引一下 |
作者: ajsong, 发布日期: 2012-05-14 15:55:35, 浏览数: 3012 |
搜索到送葬者发的帖子,他跟我的思路是一样的 KindEditor.plugin('findreplace', function(K) { var self = this, name = 'findreplace', lang = self.lang(name + '.'); self.plugin.findreplace = { edit : function() { var html = [ '<div style="padding:10px 20px;">', //find '<div class="ke-dialog-row">', '<label for="find" style="width:60px;">' + lang.find + '</label>', '<input class="ke-input-text" type="text" id="find" name="find" value="" style="width:135px;" />', '<span class="ke-button-common ke-button-outer" style="float:right;">', '<input type="button" class="ke-button-common ke-button" name="findnext" style="width:90px;" n="0" value="' + lang.findnext + '" />', '</span>', '</div>', //replace '<div class="ke-dialog-row">', '<label for="replace" style="width:60px;">' + lang.replace + '</label>', '<input class="ke-input-text" type="text" id="replace" name="replace" value="" style="width:135px;" />', '<span class="ke-button-common ke-button-outer" style="float:right;">', '<input type="button" class="ke-button-common ke-button" name="replacethis" style="width:90px;" value="' + lang.replacethis + '" />', '</span>', '</div>', //matchcase '<div class="ke-dialog-row">', '<label for="matchcase"><input type="checkbox" id="matchcase" name="matchcase" />' + lang.matchcase + '</label>', '<span class="ke-button-common ke-button-outer" style="float:right;">', '<input type="button" class="ke-button-common ke-button" name="replaceall" style="width:90px;" value="' + lang.replaceall + '" />', '</span>', '</div>', //strict '<div class="ke-dialog-row">', '<label for="strict"><input type="checkbox" id="strict" name="strict" />' + lang.strict + '</label>', '<span class="ke-button-common ke-button-outer" style="float:right;">', '<input type="button" class="ke-button-common ke-button" name="close" style="width:90px;" value="' + lang.close + '" />', '</span>', '</div>', '</div>' ].join(''); var dialog = self.createDialog({ name : name, width : 370, height : 180, title : self.lang(name), body : html, noButton : true }), div = dialog.div, findBox = K('[name="find"]', div), replaceBox = K('[name="replace"]', div), matchcaseBox = K('[name="matchcase"]', div), strictBox = K('[name="strict"]', div), findnextBtn = K('[name="findnext"]', div), replacethisBtn = K('[name="replacethis"]', div), replaceallBtn = K('[name="replaceall"]', div), closeBtn = K('[name="close"]', div); findBox.keyup(function(){ findnextBtn.attr('n', '0'); }); findnextBtn.click(function(){ if (findBox.val()=='') {alert(lang.nocontent);findBox[0].focus();return}; var val = findBox.val().replace(/</g, '<').replace(/>/g, '>').replace(/&/g, '&'), val_r = val.replace(/\\/g, '\\\\').replace(/\(/g, '\\(').replace(/\)/g, '\\)') .replace(/\[/g, '\\[').replace(/\]/g, '\\]').replace(/\{/g, '\\{').replace(/\}/g, '\\}'), html = self.html(), matchcase = matchcaseBox[0].checked ? 'g' : 'ig', pattern = strictBox[0].checked ? '\\b'+val_r+'\\b' : val_r; var matchs = html.match(new RegExp(pattern, matchcase)) || []; if (matchs.length==0) {alert(lang.nofind);return}; var m, i = 0, l = html.length, n = parseInt(K(this).attr('n')); html = html.replace(new RegExp(pattern, matchcase), function($0, j){ if (n==i) { if (n==matchs.length-1) { m = 0; findnextBtn.attr('gotofirst', 'yes'); } else { if (findnextBtn.attr('gotofirst')) {alert(lang.gotofirst);findnextBtn.removeAttr('gotofirst')}; m = n+1; } if (document.body.createTextRange) { var range = self.edit.doc.body.createTextRange(); range.moveStart("character", -l); range.moveEnd("character", -l); range.moveStart("character", j); range.moveEnd("character", val.length); range.select(); } else { /* var range = self.edit.doc.createRange(); var s = window.getSelection(); alert(s); while(window.find(val)){ s.setSelectionRange(0,0); } cmd.range.selectNodeContents(div[0]); self.cmd.select(); */ //alert(self.srcElement[0].setSelectionRange); //self.edit.doc.body.setSelectionRange(j, (j+val.length)); //self.edit.doc.body.focus(); //alert(self.cmd.selection().range.get(true)); //self.cmd.selection().range.selectNodeContents(); //self.cmd.select(); //到了这里就完全没有头绪了,在网上找了很久,有一篇是使用 setSelectionRange 设置选中,但测试了一下,setSelectionRange 好像是不支持 iframe 的。。。 }; findnextBtn.attr('n', m); }; i++; return $0; }); }); replacethisBtn.click(function(){ if (findBox.val()=='') {alert(lang.nocontent);findBox[0].focus();return} if (self.selectedText()) self.insertHtml(replaceBox.val()); findnextBtn.attr('n', '0'); }); replaceallBtn.click(function(){ if (findBox.val()=='') {alert(lang.nocontent);findBox[0].focus();return}; var val = findBox.val().replace(/</g, '<').replace(/>/g, '>').replace(/&/g, '&'), html = self.html(), matchcase = matchcaseBox[0].checked ? 'ig' : 'g', pattern = strictBox[0].checked ? '\b'+val+'\b' : val; findnextBtn.attr('n', '0'); html = html.replace(new RegExp(pattern, matchcase), replaceBox.val()); self.html(html); self.hideDialog().focus(); }); closeBtn.click(function(){ self.hideDialog().focus(); }); var text = self.selectedText(); if (text) { findBox.val(text); } findBox[0].focus(); } }; self.clickToolbar(name, self.plugin.findreplace.edit); }); |