Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/jquery/69.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 突出显示div中的文本_Javascript_Jquery_Html - Fatal编程技术网

Javascript 突出显示div中的文本

Javascript 突出显示div中的文本,javascript,jquery,html,Javascript,Jquery,Html,我想突出显示divbyjavascript函数中的文本,该函数将startindex和endindex作为参数 注意:每次调用该函数时,必须清除上一个突出显示 我不知怎么做的 HTML代码 <div id="readPara">Sounds good, eh? So good that the ASP.NET team decided to incorporate the provider model for authentication (membership), roles, u

我想突出显示divbyjavascript函数中的文本,该函数将startindex和endindex作为参数

注意:每次调用该函数时,必须清除上一个突出显示

我不知怎么做的

HTML代码

<div id="readPara">Sounds good, eh? So good that the ASP.NET team decided to incorporate the provider model for authentication (membership), roles, user profile, session and other aspects of the runtime into the ASP.NET 2.0 release in 2005. To capitalize on the provider model several new controls were added such as the CreateUserWizard, Login, ResetPassword and ChangePassword controls. These controls, given the provider model, could implement these features without knowing the details of the database being used.</div>
听起来不错,是吗?非常好,以至于ASP.NET团队决定在2005年将身份验证(成员资格)、角色、用户配置文件、会话和运行时的其他方面的提供者模型合并到ASP.NET 2.0版本中。为了利用提供者模型,添加了几个新控件,如CreateUserWizard、Login、ResetPassword和ChangePassword控件。给定提供者模型,这些控件可以实现这些特性,而不需要知道所使用数据库的详细信息。 JavaScript代码

function highlightWord(start,end){   
    $('.highLight').removeClass();
    var line = $('#readPara').text();
    console.log(line);
    if(end>line.length){
         end = line.length;   
    }   
    var newLine = line.substring(0,start) + "<span class='highLight'>" + line.substring(start,end) + "</span>" + line.substring(end,line.length);
    console.length(newLine);
    $('#readPara').contents().replaceWith(newLine);

}
函数高亮字(开始,结束){
$('.highLight').removeClass();
变量行=$('#readPara')。text();
控制台日志(行);
如果(结束>行长度){
结束=直线长度;
}   
var newLine=line.substring(0,开始)+“”+line.substring(开始,结束)+“”+line.substring(结束,行.长度);
控制台长度(换行符);
$('#readPara').contents().replaceWith(换行符);
}

请尝试帮助我。

尝试以下操作:当您再次替换所有内容时,无需删除
突出显示
span。替换html,它将span作为html元素

function highlightWord(start,end){   
    var line = $('#readPara').text();
    console.log(line);
    if(end>line.length){
         end = line.length;   
    }   
    var newLine = line.substring(0,start) + "<span class='highLight'>" +
                  line.substring(start,end) + "</span>" 
                 + line.substring(end,line.length);
    console.log(newLine);
    $('#readPara').html(newLine);// replace newline here
}
函数高亮字(开始,结束){
变量行=$('#readPara')。text();
控制台日志(行);
如果(结束>行长度){
结束=直线长度;
}   
var newLine=行。子字符串(0,开始)+“”+
行。子字符串(开始、结束)+“”
+行。子字符串(结束,行。长度);
console.log(newLine);
$('#readPara').html(换行符);//在此处替换换行符
}

试试这个

新线应该是这样的-

var newLine = line.substring(0,start) + "<span class='highLight'>" +
              line.substring(start,end) + "</span>" 
             + line.substring(end,line.length);
var newLine=line.substring(0,start)+“+
行。子字符串(开始、结束)+“”
+行。子字符串(结束,行。长度);

控制台
没有
长度
方法。我想你的意思是
log()
。你有什么问题?(注意,我确实在那个例子中调整了类名)。真棒的兄弟,事实上我昨天才知道是怎么回事。但还是要感谢您宝贵的时间和回答。:)好好看看。我试图实现这一点:PIt很棒,看起来也不错:)