gpt4 book ai didi

javascript - jQuery : Click event & Switching between "active" elements 问题

转载 作者:可可西里 更新时间:2023-11-01 14:51:20 25 4
gpt4 key购买 nike

好的,这是我的问题,我敢打赌这对你来说会 super 简单(我想这不是......大声笑)。

那么,假设我有几个 div。一旦用户点击其中之一,我只想突出显示这一个。简而言之:a) 从所有 div 中删除(如果存在)特定类,b) 将其添加到被单击的 div

这是完整的代码...

index.html

<!DOCTYPE html> 
<html style='min-height:0px;'>
<head>
<title>Page Title</title>

<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1">

<link rel="stylesheet" href="jquery.mobile.min.css" />
<link rel="stylesheet" href="custom.css" />

<script src="jquery.min.js"></script>
<script src="jquery.mobile.min.js"></script>
</head>

<body>
<div data-role="page">


</div>
<script src="custom.js"></script>
</body>
</html>

自定义.js

$(function() {
$("div").click( function() {
$("div").removeClass("msp-selected");
$(this).addClass("msp-selected");
});
});

自定义.css

media screen and (orientation: portrait) {
.ui-mobile, .ui-mobile .ui-page {
min-height: 420px;
}
}
media screen and (orientation: landscape) {
.ui-mobile, .ui-mobile .ui-page {
min-height: 300px;
}
}

div {
outline:0;
}

div:hover {
outline-width:1px;
outline-color:red;
outline-style: dotted;
overflow:hidden;

}

.msp-selected {
outline-width:1px;
outline-color:red;
outline-style: solid;
}

附言

  • 情况可能并不像最初看起来那么简单。我正在使用 jQuery 1.8.2 和 jQuery Mobile 1.3.2。实际页面在 Webview 中运行,它本身在 Cocoa/OS X 应用程序中。很复杂吧?哈哈

  • 我看不到任何错误(不容易访问...不存在...的控制台)。我唯一注意到的是,当我删除 removeClass 部分时,它确实有效。添加它,似乎使整个事情变得一团糟。

最佳答案

 $(function() {
$('div').on( "click", function() {
$(this).addClass('msp-selected');
$(this).siblings().removeClass('msp-selected');
})

关于javascript - jQuery : Click event & Switching between "active" elements 问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18185542/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com