[英]search words from text area using jquery
I am trying to search some words in a textarea. 我正在尝试在文本区域中搜索一些单词。 These words are taken from different textboxes.
这些词取自不同的文本框。 It is working fine but when I search words which have some common name like(nokia lumia and nokia lumia 310) then it is not giving me perfect result.
它工作正常,但是当我搜索具有某些常用名称的单词(如nokia lumia和nokia lumia 310)时,它并没有给我完美的结果。 I want to search complete sentence and then lock that sentence, so that it won`t be used in other searches.
我想搜索完整的句子,然后锁定该句子,这样它就不会在其他搜索中使用。
In this picture we have multiple words to be searched, but only few of them, not the whole sentence. 在这张图片中,我们有多个单词要搜索,但是只有几个单词而不是整个句子。
HTML CODE: HTML代码:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title></title>
<meta name="" content="">
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.4/jquery-ui.min.js"></script>
<link href="./JS/jquery.highlighttextarea.css" rel="stylesheet">
<script src="./JS/jquery.highlighttextarea.min.js"></script>
</head>
<body>
<div >
<form method="post" action="">
<p style="float: left; margin: 3px; margin-top: 0px;">
<textarea name="textarea" class="text" id="txtara" cols="49" rows="20"> </textarea>
</p>
<p class="area">
<input id="txt1" class="clsdoit" type="text" name="a">
<label id="lab1"></label>
</p>
<p class="area">
<input id="txt2" class="clsdoit" type="text" name="b">
<label id="lab2"></label>
</p>
<p class="area">
<input id="txt3" class="clsdoit" type="text" name="c">
<label id="lab3"></label>
</p>
<!--adding new-->
<p class="area">
<input id="txt4" class="clsdoit" type="text" name="c">
<label id="lab4"></label>
</p>
<p class="area">
<input id="txt5" class="clsdoit" type="text" name="c">
<label id="lab5"></label>
</p>
<p class="area">
<input id="txt6" class="clsdoit" type="text" name="c">
<label id="lab6"></label>
</p>
<p class="area">
<input id="txt7" class="clsdoit" type="text" name="c">
<label id="lab7"></label>
</p>
<p class="area">
<input id="txt8" class="clsdoit" type="text" name="c">
<label id="lab8"></label>
</p>
<p class="area">
<input id="txt9" class="clsdoit" type="text" name="c">
<label id="lab9"></label>
</p>
<p class="area">
<input id="txt10" class="clsdoit" type="text" name="c">
<label id="lab10"></label>
</p>
<p class="area">
<input id="txt11" class="clsdoit" type="text" name="c">
<label id="lab11"></label>
</p>
<p class="area">
<input id="txt12" class="clsdoit" type="text" name="c">
<label id="lab12"></label>
</p>
<input type="hidden" name="id" value="<?php echo $id; ?>" />
<input type="submit" name="submit" value="Save" />
</form>
</div>
<style>
.area{
margin-top: 5px; margin-bottom: 5px;
}
</style>
jquery codes jQuery代码
<script>
$(document).ready(function() {
doit();
function doit()
{
$('#txtara').highlightTextarea('destroy');
var $wrds = [];
var txt1=$('#txt1').val();
if(txt1!="")
{
$wrds.push({
color: '#FFFF00',
words: $('#txt1').val()
});
}
if($('#txt2').val()!="")
{
$wrds.push({color: '#ADF0FF', words: $('#txt2').val()});
}
if($('#txt3').val()!="")
{
$wrds.push({color: '#ADA0F0', words: $('#txt3').val()});
}
if($('#txt4').val()!="")
{
$wrds.push({color: '#9fc1f0', words: $('#txt4').val()});
}
if($('#txt5').val()!="")
{
$wrds.push({color: '#3eb5ac', words: $('#txt5').val()});
}
if($('#txt6').val()!="")
{
$wrds.push({color: '#e7c4a9', words: $('#txt6').val()});
}
if($('#txt7').val()!="")
{
$wrds.push({color: '#cee2ad', words: $('#txt7').val()});
}
if($('#txt8').val()!="")
{
$wrds.push({color: '#8a6396', words: $('#txt8').val()});
}
if($('#txt9').val()!="")
{
$wrds.push({color: '#380ced', words: $('#txt9').val()});
}
if($('#txt10').val()!="")
{
$wrds.push({color: '#4ffb64', words: $('#txt10').val()});
}
if($('#txt11').val()!="")
{
$wrds.push({color: '#9cf3c4', words: $('#txt11').val()});
}
if($('#txt12').val()!="")
{
$wrds.push({color: '#e64f28', words: $('#txt12').val()});
}
$('#txtara').highlightTextarea({
words: $wrds,
debug: false,
caseSensitive: false
});
}// END OF DOIT FUNC
$(document.body).on('keyup', ".clsdoit", function(){
doit();
});
$(".text").on('keyup',function(){
search();
search1();
search2();
search3();
search4();
search5();
search6();
search7();
search8();
search9();
search10();
search11();
});
function setCharAt(str,index,chr) {
if(index > str.length-1) return str;
return str.substr(0,index) + chr + str.substr(index+1);
}
function search(){
var a = $('#txt1').val().toLowerCase();
var totalcount=0;
var value = $('.text').val().toLowerCase();
var regex = /\s+/gi;
var wordCount = value.trim().replace(regex, ' ').split(' ').length;
var values = value.trim().replace(regex, ' ');
for(var i = 0; i < value.length; i++)
{
var index = value.toLowerCase().indexOf(a);
if(index > 0)
{
totalcount++;
value = setCharAt(value,index, '' );
}
}
$('#lab1').html(totalcount);
}
function search1(){
var a = $('#txt2').val().toLowerCase();
var totalcount=0;
var value = $('.text').val().toLowerCase();
var regex = /\s+/gi;
var wordCount = value.trim().replace(regex, ' ').split(' ').length;
var values = value.trim().replace(regex, ' ');
for(var i = 0; i < value.length; i++)
{
var index = value.toLowerCase().indexOf(a);
if(index > 0)
{
totalcount++;
value = setCharAt(value,index, '' );
}
}
$('#lab2').html(totalcount);
}
function search1(){
var a = $('#txt2').val().toLowerCase();
var totalcount=0;
var value = $('.text').val().toLowerCase();
var regex = /\s+/gi;
var wordCount = value.trim().replace(regex, ' ').split(' ').length;
var values = value.trim().replace(regex, ' ');
for(var i = 0; i < value.length; i++)
{
var index = value.toLowerCase().indexOf(a);
if(index > 0)
{
totalcount++;
value = setCharAt(value,index, '' );
}
}
$('#lab2').html(totalcount);
}
function search2(){
var a = $('#txt3').val().toLowerCase();
var totalcount=0;
var value = $('.text').val().toLowerCase();
var regex = /\s+/gi;
var wordCount = value.trim().replace(regex, ' ').split(' ').length;
var values = value.trim().replace(regex, ' ');
for(var i = 0; i < value.length; i++)
{
var index = value.toLowerCase().indexOf(a);
if(index > 0)
{
totalcount++;
value = setCharAt(value,index, '' );
}
}
$('#lab3').html(totalcount);
}
function search3(){
var a = $('#txt4').val().toLowerCase();
var totalcount=0;
var value = $('.text').val().toLowerCase();
var regex = /\s+/gi;
var wordCount = value.trim().replace(regex, ' ').split(' ').length;
var values = value.trim().replace(regex, ' ');
for(var i = 0; i < value.length; i++)
{
var index = value.toLowerCase().indexOf(a);
if(index > 0)
{
totalcount++;
value = setCharAt(value,index, '' );
}
}
$('#lab4').html(totalcount);
}
function search4(){
var a = $('#txt5').val().toLowerCase();
var totalcount=0;
var value = $('.text').val().toLowerCase();
var regex = /\s+/gi;
var wordCount = value.trim().replace(regex, ' ').split(' ').length;
var values = value.trim().replace(regex, ' ');
for(var i = 0; i < value.length; i++)
{
var index = value.toLowerCase().indexOf(a);
if(index > 0)
{
totalcount++;
value = setCharAt(value,index, '' );
}
}
$('#lab5').html(totalcount);
}
function search5(){
var a = $('#txt6').val().toLowerCase();
var totalcount=0;
var value = $('.text').val().toLowerCase();
var regex = /\s+/gi;
var wordCount = value.trim().replace(regex, ' ').split(' ').length;
var values = value.trim().replace(regex, ' ');
for(var i = 0; i < value.length; i++)
{
var index = value.toLowerCase().indexOf(a);
if(index > 0)
{
totalcount++;
value = setCharAt(value,index, '' );
}
}
$('#lab6').html(totalcount);
}
function search6(){
var a = $('#txt7').val().toLowerCase();
var totalcount=0;
var value = $('.text').val().toLowerCase();
var regex = /\s+/gi;
var wordCount = value.trim().replace(regex, ' ').split(' ').length;
var values = value.trim().replace(regex, ' ');
for(var i = 0; i < value.length; i++)
{
var index = value.toLowerCase().indexOf(a);
if(index > 0)
{
totalcount++;
value = setCharAt(value,index, '' );
}
}
$('#lab7').html(totalcount);
}
function search7(){
var a = $('#txt8').val().toLowerCase();
var totalcount=0;
var value = $('.text').val().toLowerCase();
var regex = /\s+/gi;
var wordCount = value.trim().replace(regex, ' ').split(' ').length;
var values = value.trim().replace(regex, ' ');
for(var i = 0; i < value.length; i++)
{
var index = value.toLowerCase().indexOf(a);
if(index > 0)
{
totalcount++;
value = setCharAt(value,index, '' );
}
}
$('#lab8').html(totalcount);
}
function search8(){
var a = $('#txt9').val().toLowerCase();
var totalcount=0;
var value = $('.text').val().toLowerCase();
var regex = /\s+/gi;
var wordCount = value.trim().replace(regex, ' ').split(' ').length;
var values = value.trim().replace(regex, ' ');
for(var i = 0; i < value.length; i++)
{
var index = value.toLowerCase().indexOf(a);
if(index > 0)
{
totalcount++;
value = setCharAt(value,index, '' );
}
}
$('#lab9').html(totalcount);
}
function search9(){
var a = $('#txt10').val().toLowerCase();
var totalcount=0;
var value = $('.text').val().toLowerCase();
var regex = /\s+/gi;
var wordCount = value.trim().replace(regex, ' ').split(' ').length;
var values = value.trim().replace(regex, ' ');
for(var i = 0; i < value.length; i++)
{
var index = value.toLowerCase().indexOf(a);
if(index > 0)
{
totalcount++;
value = setCharAt(value,index, '' );
}
}
$('#lab10').html(totalcount);
}
function search10(){
var a = $('#txt11').val().toLowerCase();
var totalcount=0;
var value = $('.text').val().toLowerCase();
var regex = /\s+/gi;
var wordCount = value.trim().replace(regex, ' ').split(' ').length;
var values = value.trim().replace(regex, ' ');
for(var i = 0; i < value.length; i++)
{
var index = value.toLowerCase().indexOf(a);
if(index > 0)
{
totalcount++;
value = setCharAt(value,index, '' );
}
}
$('#lab11').html(totalcount);
}
function search11(){
var a = $('#txt12').val().toLowerCase();
var totalcount=0;
var value = $('.text').val().toLowerCase();
var regex = /\s+/gi;
var wordCount = value.trim().replace(regex, ' ').split(' ').length;
var values = value.trim().replace(regex, ' ');
for(var i = 0; i < value.length; i++)
{
var index = value.toLowerCase().indexOf(a);
if(index > 0)
{
totalcount++;
value = setCharAt(value,index, '' );
}
}
$('#lab12').html(totalcount);
}
});
I havent used the jquery highlighter plugin but on order to iterate over a regex per sentence you can do something like this with a while loop. 我还没有使用jQuery荧光笔插件,但是为了迭代每个句子的正则表达式,您可以使用while循环执行类似的操作。 You have to turn off use strict.
您必须关闭使用严格。
Var mystr = 'textarea text etc. ..';
Var reg = RegExp='(^|\\.)([^\\.]*' + '(' + 'nokia' + '|' ' whatever' + '))+', 'g');
While(each = reg.exec(mystr)){
Var sentence = each[0];
// use the index position of the reg to relate to the position in the textarea
Console.log(reg.lastIndex);
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.