Jquery 获取具有onclick的div

我有很多这样的部门：

<div id="one" onclick="test('important data one')">ONE</div>
<div id="two" onclick="test('important data two')">TWO</div>

function test(data){
  //do important stuff with data
}

---

在这个函数中，我需要获取被单击的div的id$（这个）不起作用。我可以将其作为变量传递，但我不想更改html（很多）。可以在函数中访问div而不更改html吗？

为什么不更改函数以将此作为参数传递

<div id="one" onclick="test('important data one', this)">ONE</div>
<div id="two" onclick="test('important data two', this)">TWO</div>

---

您需要使用jQuery设置

单击
处理程序，使其按预期工作：

$('#one').click(function() {
  // here you can use $(this)
})

为Firefox支持而编辑：

<div id="one" onclick="test('important data one',this)">ONE</div>

您可以添加事件参数以获取事件目标：

事件

function test(data, e) {
    // do important stuff with data
    var evt=e||window.event;
    var el=evt.target||evt.srcElement;
    var id=el.id; // id of the clicked div
}

function test(data, element) {
    // do important stuff with data
    var id=element.id;
}

哪些需要这些电话：

<div id="one" onclick="test('important data one', event)">ONE</div>
<div id="two" onclick="test('important data two', event)">TWO</div>

<div id="one" onclick="test('important data one', this)">ONE</div>
<div id="two" onclick="test('important data two', this)">TWO</div>

哪些需要这些电话：

<div id="one" onclick="test('important data one', event)">ONE</div>
<div id="two" onclick="test('important data two', event)">TWO</div>

<div id="one" onclick="test('important data one', this)">ONE</div>
<div id="two" onclick="test('important data two', this)">TWO</div>

1
两个


区别在于，在第一种情况下，您最终可以获得有关刚刚处理的事件的更多信息。在第二种情况下，您只能获取触发事件的元素的相关信息（如果您认为不再需要有关事件的更多信息，则效率更高）。
我将在javascript中设置单击处理程序，而不是在html中设置。最好的做法是把所有东西都分开，这样维护起来就容易多了。如果要我写的话，你的案子会是这样的：

HTML

我在这里举了一个小例子：

我认为这应该解释清楚，但请随意询问您是否需要任何进一步的帮助。
将
此
添加到每个onclick将是最简单的选择。对此不确定，但是，由于您在onclick=”“范围内，是否有e或事件变量？可以查看一下，如果是，它应该包含事件目标。（div）@Johan不在Firefox中不能在ff中工作，在
if（！event）{event=window.event；}
，
event
只能是
window.event
@user1985273当前正在测试我认为这样附加数据不是一个好主意，可能会被误认为是html5数据存储；此外，您的代码可能要简单得多。@Pawel\W名称可能更好，所以我更新了我的答案，尽管我认为这不是一个大问题。这不是数据属性的作用吗？请随时详细说明您的“简单得多”解决方案。这毕竟是一个发布答案的地方，而不仅仅是评论。。。
<div id="one" class='test' data-test='important data one'>ONE</div>
<div id="two" class='test' data-test='important data two'>TWO</div>

    // your function
    function test($div){
      alert('my id is [' + $div.attr('id') + '] and my data is [' + $div.attr('data') . ']'); 
    }

    // when the dom is ready
    $(document).ready(function() {
        // set the click handlers
        $('.test').click(function() {
           // call your function, with the trigger (as a jQuery object) as parameter        
           test($(this));
        });
    });