Question

当点击某个表单的某个元素（id）时，我想听一下该事件，并更改该元素的背景。

$(document).ready(function(){
    $('form').on('click', function(e){        
        var x = e.target.id;
        $(x).css('background-color',color);
        return false;
    });
}


<form>
  <div id="a">Item1</div>
  <div id="b">Item2</div>
  <div id="c">Item3</div>
</form>

Answer 1

您的代码最终会查找标记名称，因为选择器是

$("b")

如果您想按照自己的方式进行操作，则需要添加缺少的#。

$("#" + x).css('background-color',color);

但是当你已经引用is时，没有必要查找元素。使用事件委托和本

$('form').on('click', 'div', function(e){        
    $(this).css('background-color',color);
});

Answer 2

为什么要使用e.target？只需更新您的代码即可使用$(this)：

$(function() {  
    $('form > div').on('click', function(e) {  
        e.preventDefault();
        $(this).css('backgroundColor', color);
    });
});

Answer 3

这将有用。照顾你的标签。

 $(document).ready(function(){
    $('form').on('click', function(e){   
        var x = e.target.id;
        $("#"+x).css('background-color',"red");
        return false;
    });
});

Answer 4

发生在你身上的事情是event.target.id返回一个字符串，表示元素的id，而不是选择器。所以你使用$（x）....你必须使用$（'＃'+ x），你的实际代码不起作用，因为后台更改的选择器不是在寻找具有X值的元素Id但对于一个名为X的值的元素（例如x =“a”，那么它正在寻找元素）

Answer 5

这是我的＆＃34;卑微＆＃34;尝试：

<!DOCTYPE html>
<html lang = 'es'>
    <head>
        <title> My Test </title>
    </head>
    <body>
        <form>
          <div id="a"> Item1 </div>
          <div id="b"> Item2 </div>
          <div id="c"> Item3 </div>
        </form>
        <script>
            function addBackgroundColor(e){
                var index = parseInt(Math.random() * 4); // the number of the multiplier has to be equal to the length of the array colorsList.
                e.target.style.backgroundColor = colorsList[index];
            }

            var colorsList = ['blue','red','green','yellow','orange']; //add others colors here if you want.
            var divsList = document.getElementsByTagName('div');
            for (var i in divsList){
                divsList[i].addEventListener('click', addBackgroundColor);
            }   

        </script>
    </body>
</html>

Answer 6

无需幻想。只是做

$(document).ready(function(){
    $('form div').on('click', function(e){        
        $(this).css('background-color',color);
        return false;
    });
}

更改单击的ID的背景

6 个答案: