主题: 想做个查找替换功能啊,全部替换就好做,但是单个替换和查找之后高亮显示很费解啊,给点思路
作者: 送葬者, 发布日期: 2012-04-12 10:06:47, 浏览数: 3522

想加入一个查找和替换功能,但是创建之后取不到值啊- -


KindEditor.plugin('replaceall', function(K) {
    var self = this, name = 'replaceall', lang = self.lang(name + '.');
self.plugin.replaceall = {
edit : function() {
       var html = [
       '<div style="padding:10px 20px;">',
       //查找
      '<div class="ke-dialog-row">',
       '<label for="keUrl" style="width:60px;">' + lang.find + '</label>',
       '<input class="ke-input-text" type="text" id="txtfind" name="txtfind" value="" style="width:160px;" /> &nbsp;',
       '<span class="ke-button-common ke-button-outer">',
       '<input type="button" class="ke-button-common ke-button " name="btnfind"  value="' + lang.btnfind + '"  style="width:80px;"  /> ',
       '</span>',
       
       '</div>',
       //查找END
       //替换
       '<div class="ke-dialog-row">',
       '<label for="keUrl" style="width:60px;">' + lang.newtext + '</label>',
       '<input class="ke-input-text" type="text" id="keUrl" name="newtext" value="" style="width:160px;" /> &nbsp;',
      
      
       '</div>',
       //替换END
        //替换
       '<div class="ke-dialog-row">',
       '<label for="keUrl" style="width:60px;float:left;">' + lang.MatchCase + '</label>',
       '<span  style="float:left;">',
       '<input type="checkbox" name="matchCase" />',
       '</span>',
        '<span class="ke-button-common ke-button-outer" style="margin-left:5px;float:left;">',
       '<input type="button" class="ke-button-common ke-button " name="checknewBtn" value="' + lang.btnchecknewtext + '" style="width:80px;"/>',
       '</span>',
        '<span class="ke-button-common ke-button-outer" style="margin-left:5px;float:left;">',
       '<input type="button" class="ke-button-common ke-button " name="checknewAllBtn" value="' + lang.btnchecknewtextall + '" style="width:80px;"/>',
       '</span>',
       '</div>',
       //替换END
       '</div>'
       ].join('');
       var dialog = self.createDialog({
       name : name,
       width : 400,
       height : 200,
       title : self.lang(name),
       body : html
       }),
       div = dialog.div,
       txtfind = K('[name="txtfind"]', div),
       newtext = K('[name="newtext"]', div),
       findBtn = K('[name="btnfind"]', div),
       checknewBtn = K('[name="checknewBtn"]', div),
       checknewAllBtn = K('[name="checknewAllBtn"]', div),
       MatchCase=K('[name="matchCase"]',div),
       html=self.html(),
       jjj=K['iframe',self]
       ;
       
                  
        //查找事件
     
       findBtn.click(function(e){
           //判断查找值是否为空
           
           if(txtfind.val()==null||txtfind.val()=="")
           {
               alert("'"+ lang.findisnull +"'");
               return;
           }
           var iFlag;
           if   (MatchCase.checked)   
           {iFlag=4;}   
                        else   
           {iFlag=0;}  
            //这里进行查找没思路- -
       });
       //单个替换
       checknewBtn.click(function(e) {
                 //这里单个替换,思路是,先将内容查找到,然后替换选中区域的内容- -但是查找功能做不了啊,亲,给点思路啊
       });
       //全部替换
       checknewAllBtn.click(function(e) {
        
       });
      
      


                }
            }
       self.clickToolbar(name, self.plugin.replaceall.edit);
});

作者: ajsong, 发布日期: 2012-05-14 15:49:43
我跟楼主的思路是一样的,但只做到IE查找得到,非IE就不知道了


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, '&lt;').replace(/>/g, '&gt;').replace(/&/g, '&amp;'),
				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, '&lt;').replace(/>/g, '&gt;').replace(/&/g, '&amp;'),
				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);
});


希望懂的高手能指导一下

回复
发表新帖 发表回复