更改所选文本的背景颜色，HTML JQUERY

I recently customize an existing code to segment a plain text into four class by select a part of text then coloring it, after that I retrieve the text of each class to store it in my db, this code http://jsfiddle.net/ouss88/t53wtquf/9/ works well but i want to denied nested span (html tag that determine the class) exemple:

我最近自定义了一个现有代码，通过选择文本的一部分然后着色它将纯文本分成四个类，之后我检索每个类的文本以将其存储在我的数据库中，此代码http://jsfiddle.net/ ouss88 / t53wtquf / 9 /运行良好，但我想否定嵌套的span（确定类的html标签）例如：

<span class="class1"> text text text </span> ----> accepted
 <span class= class1"> tex <span class="class 2> text  </span> text </span>--> not accepted.

what should i add to this code http://jsfiddle.net/ouss88/t53wtquf/9/

我该怎么加入这段代码http://jsfiddle.net/ouss88/t53wtquf/9/

PS: After I select a part of text, i hover the mouse cursor on one of the four class (1.2.3.4) to color the background of the selected text, tou can try by yourself on this link above, i just want to denied embedded class

PS：在我选择一部分文本后，我将鼠标光标悬停在四个类（1.2.3.4）中的一个上，为所选文本的背景着色，tou可以自己尝试上面这个链接，我只是想否认嵌入式课程

1 个解决方案

#1

-1

Do something like this, more compact. I think you get the idea.

做这样的事情，更紧凑。我想你应该已经明白了。

$('table td').mouseenter(function(){
  $(this).addClass('hilited'+$(this).attr('id'));  
}).mouseleave(function(){
  $(this).removeClass('hilited'+$(this).attr('id'));  
});

.hilited1{color:green}
.hilited2{color:red}
.hilited3{color:blue}
.hilited4{color:yellow}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<table>
<tr>
    <tr> <td id="1"> hover on me for Class1 </td> </tr>
    <tr> <td id="2">  hover on me for Class2 </td> </tr>
    <tr> <td id="3">  hover on me  for Class3 </td> </tr>
    <tr> <td id="4">  hover on me  for Class4 </td> </tr>
    
</tr>
</table>

1 个解决方案

#1

更多相关文章

随机推荐