jQuery/JavaScript我的脚本中的活动链接-下划线不正确

jQuery/JavaScript Active link in my script - bad underline

本文关键字：链接 活动 下划线 不正确 JavaScript 我的 脚本 jQuery      更新时间：2023-09-26

今天我遇到了以下问题。我想在我点击的活动链接上预印一个将被强调的脚本。我不知道该怎么办。你能给我一些建议吗？？

我有主意，但我不知道这是否是一个好的解决方案。

我认为我应该准备css类。它应该是这样的：

.active {
text_decoration: underline;
}

我想我会使用方法.addClass（"active"）和removeClass（"active"）

我准备了简单的代码，但它本身不起作用。

$(function(){
    $("li input").on( "click", function(e) 
    {
        $(this).addClass("active");
    });
});

现在我不知道如何删除前面元素（对象）的下划线

<ul>
                    <li><input type="button" onClick="Clock(0)" value="MADRID" name="MADRID"/></li>
                    <li><input type="button" onClick="Clock(0)" value="AMSTERDAM" name="AMSTERDAM"/></li>
                    <li><input type="button" onClick="Clock(4)" value="ABU DHABI" name="ABU DHABI"/></li>
                    <li><input type="button" onClick="Clock(1)" value="LONDON" name="LONDON"/></li>
                    <li><input type="button" onClick="Clock(8)" value="HONG KONG" name="HONG KONG"/></li>
                    <li><input type="button" onClick="Clock(8)" value="CHINA" name="CHINA"/></li>
                    <li><input type="button" onClick="Clock(3)" value="ATHENS" name="ATHENE"/></li>
                    <li><input type="button" onClick="Clock(8)" value="SINGAPORE" name="SINGAPORE"/></li>
                    <li><input type="button" onClick="Clock(4)" value="MOSCOW" name="MOSCOW"/></li>
                    <li><input type="button" onClick="Clock(7)" value="JAKARTA" name="JAKARTA"/></li>
                </ul>

有一些错误

$(function(){
    var ins = $("li input").on( "click", function(e) {
        ins.not(this).removeClass('active')
        $(this).addClass("active");
    });
});

和

.active {
    text-decoration: underline;
}

演示：Fiddle

将CSS中的类声明更改为

.active
{
    text-decoration : underline; /* YOU HAD WRITTEN 'text_decoration' */
}

将"_"替换为"-"

如果您试图在单击时只激活一个按钮。

$(function(){
    $("li input").on( "click", function(e) 
    {
       $(this).addClass("active").siblings().parent().find('input').removeClass("active");
    });
});

而且你的css代码片段中也有一个拼写错误。应该是：

.active{
text-decoration:underline;
}

如果您希望某个元素在页面刷新时保持活动状态，那么您可以简单地将html标记上的"活动"类添加为：

<li><input type="button" onClick="Clock(0)" value="MADRID" name="MADRID" class="active" /></li>

在您想要的任何列表项的输入上

相关文章：