用vue让a标签点击高亮（附代码）-js教程-PHP中文网

首页

web前端

js教程

用vue让a标签点击高亮（附代码）

php中世界最好的语言

May 10, 2018 pm 03:10 PM

代码点击高亮

这次给大家带来用vue让a标签点击高亮（附代码），用vue让a标签点击高亮的注意事项有哪些，下面就是实战案例，一起来看一下。

如下所示：

<!DOCTYPE html>
<html
lang="en">
<head>
<title></title>
<meta
charset="UTF-8">
<meta
name="viewport"
content="width=device-width, initial-scale=1">
<!--<link href="css/style.css" rel="external nofollow" rel="stylesheet">-->
<script
src="js/jquery.js"></script>
<script
src="js/vue(2.0).js"></script>
<style
lang="less"
rel="stylesheet/less">
.a {
display:
block;
float:
left;
margin-left:
20px;
}
.active {
color:
red;
font-size:
17px;
}
</style>
</head>
<body>
<p
id="app">
<a
class="s-bt" @click="selected(Aname.name)"
 :class="{active: active == Aname.name}"
v-for="Aname in Alist">{{Aname.name}}</a>
</p>
<script>
new
Vue({
el:
'#app',
data: {
Alist: [{
name:
'影视大咖'
}, {
name:
'女明星'
}, {
name:
'男明星'
}, {
name:
'商业大亨'
}],
active:
''
},
mounted() {
},
methods: {
selected(name) {
this.active
= name;
}
}
})
</script>
</body>
</html>

登录后复制

相信看了本文案例你已经掌握了方法，更多精彩请关注php中文网其它相关文章！

热AI工具

热工具

热门话题

gmail邮箱登陆入口在哪里

7444

CakePHP 教程

1371

steam的账户名称是什么格式

win11激活密钥永久

NYT连接提示和答案

显示更多

Related knowledge

解决win7驱动程序代码28的方法 Dec 30, 2023 pm 11:55 PM

有的用户在安装设备的时候遇到了错误，提示错误代码28，其实这主要是由于驱动程序的原因，我们只要解决win7驱动程序代码28的问题就可以了，下面就一起来看一下应该怎么来操作吧。win7驱动程序代码28怎么办：首先，我们需要点击屏幕左下角的开始菜单。接着，在弹出的菜单中找到并点击“控制面板”选项。这个选项通常位于菜单的底部或者附近。点击后，系统会自动打开控制面板界面。在控制面板中，我们可以进行各种系统设置和管理操作。这是怀旧大扫除关卡中的第一步，希望对大家有所帮助。然后，我们需要继续操作，进入系统和

蓝屏代码0x0000001怎么办 Feb 23, 2024 am 08:09 AM

蓝屏代码0x0000001怎么办蓝屏错误是电脑系统或硬件出现问题时的一种警告机制，代码0x0000001通常表示出现了硬件或驱动程序故障。当用户在使用电脑时突然遇到蓝屏错误，可能会感到惊慌和无措。幸运的是，大多数蓝屏错误都可以通过一些简单的步骤进行排除和处理。本文将为读者介绍一些解决蓝屏错误代码0x0000001的方法。首先，当遇到蓝屏错误时，我们可以尝试重

在iPhone iOS 17上如何设置多个计时器 Sep 18, 2023 am 09:01 AM

在iOS17中，您可以使用时钟应用程序在iPhone上设置多个计时器，或使用Siri免提设置。我们在本文中讨论了两者。让我们来看看它们。使用时钟应用程序在iPhone上设置多个计时器打开iPhone上的时钟应用程序，然后点击右下角的计时器选项卡。现在，设置小时、分钟和秒。您可以使用“标签”和“计时器何时结束”选项来设置计时器的名称以及计时器完成时的首选音调。这将帮助您区分计时器。完成后，点击“开始”按钮。然后，点击右上角的“+”图标。现在，重复上述步骤以在iPhone上设置多个计时器。您还可以浏

电脑频繁蓝屏而且每次代码不一样 Jan 06, 2024 pm 10:53 PM

win10系统是一款非常优秀的高智能系统强大的智能可以为用户们带来最好的使用体验，一般正常的情况下用户们的win10系统电脑都不会出现任何的问题！但是在优秀的电脑也难免会出现各种故障最近一直有小伙伴们反应自己的win10系统遇到了频繁蓝屏的问题！今天小编就为大家带来了win10电脑频繁蓝屏不同代码的解决办法让我们一起来看一看吧。电脑频繁蓝屏而且每次代码不一样的解决办法：造成各种故障代码的原因以及解决建议1、0×000000116故障原因：应该是显卡驱动不兼容。解决建议：建议更换厂商原带驱动。2、

制作 iPhone 上 iOS 17 提醒应用程序中的购物清单的方法 Sep 21, 2023 pm 06:41 PM

如何在iOS17中的iPhone上制作GroceryList在“提醒事项”应用中创建GroceryList非常简单。你只需添加一个列表，然后用你的项目填充它。该应用程序会自动将您的商品分类，您甚至可以与您的伴侣或扁平伙伴合作，列出您需要从商店购买的东西。以下是执行此操作的完整步骤：步骤1：打开iCloud提醒事项听起来很奇怪，苹果表示您需要启用来自iCloud的提醒才能在iOS17上创建GroceryList。以下是它的步骤：前往iPhone上的“设置”应用，然后点击[您的姓名]。接下来，选择i

GE通用远程代码可在任何设备上编程 Mar 02, 2024 pm 01:58 PM

如果您需要远程编程任何设备，这篇文章会给您带来帮助。我们将分享编程任何设备的顶级GE通用远程代码。通用电气的遥控器是什么？GEUniversalRemote是一款遥控器，可用于控制多个设备，如智能电视、LG、Vizio、索尼、蓝光、DVD、DVR、Roku、AppleTV、流媒体播放器等。GEUniversal遥控器有各种型号，具有不同的功能和功能。GEUniversalRemote最多可以控制四台设备。顶级通用遥控器代码，可在任何设备上编程GE遥控器配备一组代码，使其能够与不同设备相配合。您可

解决代码0xc000007b错误 Feb 18, 2024 pm 07:34 PM

终止代码0xc000007b在使用电脑时，有时会遇到各种各样的问题和错误代码。其中，终止代码最为令人困扰，尤其是终止代码0xc000007b。这个代码表示某个应用程序无法正常启动，给用户带来了不便。首先，我们来了解一下终止代码0xc000007b的含义。这个代码是Windows操作系统的错误代码，通常发生在32位应用程序尝试在64位操作系统上运行时。它表示应

如何在iPhone上的'通讯录”中设置我的名片 [2023] Sep 22, 2023 pm 09:17 PM

借助iOS中的“我的名片”，您可以创建个性化的联系人名片，Siri和其他服务可识别该名片，并与您和您的电话号码相关联。随着iOS17中联系人海报的引入，“我的卡片”变得非常重要，因为它现在用于创建您的联系人海报。如果您渴望启动并运行联系人海报，则必须从设置“我的名片”开始。我们将逐步介绍如何创建“我的名片”以及如何使其与Siri和您的联系人海报顺利配合使用。如何在iPhone上的“通讯录”中设置“我的名片”[2023]如果您是首次在iPhone上设置“我的名片”，则必须仅通过“通讯录”应用进行设

See all articles

用vue让a标签点击高亮（附代码）

热AI工具

Undresser.AI Undress

AI Clothes Remover

Undress AI Tool

Clothoff.io

AI Hentai Generator

热门文章

热工具

记事本++7.3.1

SublimeText3汉化版

禅工作室 13.0.1

Dreamweaver CS6

SublimeText3 Mac版

热门话题