Question

我有一个索引页面，用户可以一次激活一个项目。当用户单击激活按钮时，我想对该项目执行某些操作。我的困境是如何识别在页面上点击了哪个项目。有没有办法可以使用1个javascript函数来处理点击的任何项目？

HTML：

<ul>
  <li> item 1 </li>  
  <li> item 2 </li>  
  <li> item 3 </li>
</ul>

JS：

  $('.li').click(function() {
    $.ajax({
      url: "/activate,
      type: 'post',
      dataType: "json",
      data: {
        item: { id: 1 }
      },
      success: function(data){
        alert("you did it")
      }
    })
  })

Answer 1

要扩展其他注释，一旦修复了其他错误（例如您的选择器，缺少分号等），您可以使用this变量来检索您正在查找的信息。此外，您可以为每个li元素添加一个id，以便您知道正在查看哪个。例如：

HTML

<ul>
  <li id="li1"> item 1 </li>  
  <li id="li2"> item 2 </li>  
  <li id="li3"> item 3 </li>
</ul>

的Javascript

$('li').click(function() {
    console.log($(this).attr('id'));
});

Answer 2

如果您尝试选择<li>元素，请在jQuery中将.li更改为li（只需删除点）。

你只用点“。”当你选择一个类（“＃”来选择一个id）。所以基本上你一直在选择一个名为li的类而不是元素<li>

选择所需的元素后，在jQuery选择器中，您可以使用$(this)来引用所单击的相同元素。

例如：

更改颜色

$("li").click(function(){

  //Button was clicked
  $(this).css("color", "#ff0000"); // Change color of clicked li
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
  <li>test 1</li>
  <li>test 2</li>
</ul>

Answer 3

传递给您的函数的参数event处理点击。从那里你可以找到目标元素：

$('.li').click(function(event) {
   var target = event.target;
   ....
});

另一种方式是this指标：

$('.li').click(function() {
 $(this).text();
});

点击索引页面上的项目后发布ajax

3 个答案: