Question

我正在尝试创建一个表情符号系统，其中一个名为emoji.css的文件将存储该表情符号。所有表情符号的名称都存储在一个真正的javascript数组中，尽管稍有变化。（例如：emoji：，，：another-emoji：：） Javascript应该检查文本是否在emoji数组中，如果是，它将自动转换为emoji。

这就是我要尝试的

这是应该发生的步骤

页面加载
用户输入为“ input”类的输入

如果文本在名为的数组中 emoji，javascript

 i.Alerts the name of the input

 ii.Says 'it is in array'

 iii.Copy the text into a div with class 
    `see`

 iv.Text in div automatically becomes an array`

我认为这就是问题所在。

在emoji.css文件中，所有表情符号都具有名称类似em em-abc，em em-woman的类，但是当用户要调用表情符号时，他们必须输入带有:的文本像:abc:，:woman:一样在前面和后面，因此jquery应该自动将输入字符串（:abc:）更改为emoji.css类（em em-abc），我使用了这一行代码为此

$(".see").addClass("em em-"+$(".see").html().split(":").pop()).removeClass(".see"); 这是我的完整代码：

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Rad emojis</title>
  <style>
  div {
    color: blue;
  }
  span {
    color: red;
  }
  </style>
  <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
  <link href="emoji.css" rel="stylesheet">

</head>
<body>
 <div class ="see em-abc"></div>

 <input class="input">
 <div class ="see"></div>
  <div class ="see2"></div>
    <div class ="see3"></div>

<div class="add"></div>



<script>
var emoji = [ ":abc:", ":woman",":eye:", <!--it was much longer than this--> ];

var input=$(".input");
var input2=$(".input").val();



 $(input).change(function(){

$(".see").html( $(".input").val());


if(jQuery.inArray($(".input").val(), emoji) != -1) {

var see="."+$(".see").html();
$(".see2").html(see);

var classs =see+"";

alert($(".see").html());

var real=$(".see").html().split(":").pop();
$(".see3").html(real);


 $(".see").toggleClass("em em-"+$(".see").html().split(":").pop());

    $(".see").addClass("em em-"+$(".see").html().split(":").pop()).removeClass(".see");

    alert("is in array");
    alert($(".see").html());
} else {
    alert("is NOT in array");


} 

});






</script>

</body>
</html>

Answer 1

使用removeClass方法删除类时，必须省略点。

只需使用

    $(".see").addClass("em em"+$(".see").html().split(":").pop()).removeClass("see");

无法完全更改jQuery类

1 个答案: