javascript - js点击添加颜色

标签 javascript html css

我有一个问题。所以基本上我正在尝试创建一个 js 脚本,当用户点击一个链接时,它会用不同的颜色为链接着色,然后将链接添加到输入框,当用户再次点击同一个链接时,它会更改颜色恢复为原始颜色并从输入框中删除文本。目的是作为搜索过滤器,您可以在其中添加到搜索框、预定义的关键字。

$('.tagsSelect a').click(function() {
    var clickColor = this.style.color;

    if(clickColor = "#F5EBD5"){
        var value = $(this).text();
        var input = $('#popGirlMenu');
        input.val(input.val() + value + ', ');
        this.style.color="#f5d47f";
        return false;
    }
    if(clickColor = "#f5d47f") {
        var value = $(this).text();
        var input = $('#popGirlMenu');
        input.val(input.val() - value - ', ');
        this.style.color="#F5EBD5";
        return false;
    }
});

这是我的代码,它有效,当用户再次点击链接时,它不会将颜色改回原来的颜色,也不会从输入框中删除文本。

对不起,我的英语不好

最佳答案

为您的布局使用 CSS,并检查类而不是颜色值:

CSS

a { color: blue; }
a.selected { color: red; }

HTML

<a href="#">link a</a>
<a href="#">link b</a>
<input id="txt" type="text" />

JavaScript

$("a").click(function() {
    var $this = $(this);
    $this.toggleClass("selected");
    if ($this.hasClass("selected"))
        $("#txt").val($("#txt").val() + $this.text() + ", ");
    else
        $("#txt").val($("#txt").val().replace($this.text() + ", ", ""));
});

查看此 jsFiddle

注意要从字符串中删除一部分,您需要用空字符串替换该部分。 - 不适用于字符串。

关于javascript - js点击添加颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25976560/

相关文章:

javascript - 更改文字颜色

css - LESS 混入一个变量类名

jquery - 如何在 Bootstrap 轮播中裁剪视频

javascript - Ember CLI - 用于第 3 方 API 的 RESTAdapter

javascript - Underscore.js : iterate json object and check key availability using _. 有()

javascript - Canvas 与矩形的碰撞

html - 非全屏时标题会更改字体和位置

javascript - webcomponents.js 影子 DOM :host selector does not work on Safari and Firefox

html - 让两个 div 彼此相邻 float 时遇到一些问题

javascript - 使用 backbone 和 require 的传单