Question

我的HTML页面如下：

<!DOCTYPE html>
<html>
<head><link rel= "stylesheet" type= "text/css" href="main.css"/>
</head>
<body>
<a href="#" class="hv1 bck">Vedios</a>
<div class="hva1"></div>
<script src="js/jquery.js"></script>
<script src="js/js.js"></script>
<script src="js/main.js"></script>
</body>
</html>

我的main.css页面如下：

.bck{background:red; color:green;}

我的js.js页面如下：

$('[class=hv1]').hover(function(){$('[class=hva1]').html('Free video tutorials');});

上面的示例是描述我的关注，实际上我正在尝试编写多个类，分配为一个用于CSS，一个用于jquery在一个标记中，遗憾的是不能正常工作，但是如果我将它们作为单个逐个或单独写入标签，然后他们工作，有没有任何解决方案在一个标签写两个类？

Answer 1

您的HTML很好，您可以按原样添加两个带有空格的类：

<a href="#" class="hv1 bck">Vedios</a>

您的JS只能查找这两个类.hv1或.bck中的任何一个：

$('.hv1').hover(function(){
  $('.hva1').html('Free video tutorials');
});

或两者如果你想要：

$('.hv1.bck').hover(function(){
  $('.hva1').html('Free video tutorials');
});

除非您尝试以不同的方式执行某些操作，否则您无法专门调用class的名称

FIDDLE

Answer 2

您已经使用了jQuery选择器[name="value"]：

选择具有指定属性的元素，其值完全等于某个值。

如果您更改为[name~="value"]，则会将选项更改为：

选择具有指定属性的元素，其值包含由空格分隔的给定单词。

有关其他选择器，请参阅http://api.jquery.com/category/selectors/

一个标签中的多个类（jquery和css）

2 个答案: