使用.click而不是onclick并获取变量值

我已经看到像onclick，mouseover等内联/ html事件使用越来越少，建议使用Javascript注册事件。使用.click而不是onclick并获取变量值

目前，我有一些HTML这样的：

<ul id="supported-locations"> 
    <li onclick="setLocationId(32);">Mexico</li> 
    <li onclick="setLocationId(35);">Mongolia</li> 
</ul>

，工作正常，但我想现在这样做没有“的onclick”的HTML，但仍然能够找回ID号。

<li>这个<li>元素通过AJAX检索，而用户键入到一个输入框中，它查询数据库并检索数据而不加载页面。

当用户点击其中一个国家时，它将运行setLocationId函数，它只是简单地设置一个带有所选国家ID的隐藏HTML表单元素，这样我就可以在表单提交后使用它。

当这些<li>的国家和他们的ID将总是不同并且根据用户输入的内容而变化时，您如何为这些<li>注册事件监听器？

来源

2013-08-28 ibanore

使用数据属性持有的数量。在onclick事件上，阅读被单击元素的属性。

HTML：

<ul id="supported-locations"> 
    <li data-code="32">Mexico</li> 
    <li data-code="35">Mongolia</li> 
</ul>

的JavaScript：

$("#supported-locations").on("click", "li", function() {  
    var li = $(this); 
    console.log(li.data("code")); 
});

实施例：

JSFiddle

来源

2013-08-28 12:56:28 epascarello

正是我会做，但你输入速度更快:) –

您可以将一个事件处理程序li：

<ul id="supported-locations"> 
    <li id="location32">Mexico</li> 
    <li id="location35">Mongolia</li> 
</ul> 

$("#supported-locations li").click(function() { 
    alert($(this).attr("id")); 
});

http://jsfiddle.net/puL95/

来源

2013-08-28 12:56:07

试试这个。

$("#supported-locations li").click(function() { 
    alert("me") 
    }

来源

2013-08-28 12:57:19

<ul id="supported-locations"> 
    <li data-id="32">Mexico</li> 
    <li data-id="35">Mongolia</li> 
</ul> 

jQuery(function(){ 
$('#supported-locations li').click(function(){ 
alert($(this).data('id')) 
}) 
})

来源

2013-08-28 12:57:23

我建议给予类来动态加载的元素，然后使用jquery。对（http://api.jquery.com/on/）方法来事件listeneres注册到属于一类的元件，即使是那些dinamically加载..

然后你可以读出存储在元素中的数据（以data-something属性的形式）。

来源

2013-08-28 12:57:41 Fazi

<ul id="supported-locations> 
    <li id="32">Mexico</li> 
    <li id="35">Mongolia</li> 
</ul>

// jQuery的

$("#supported-locations > li").on('click',function(){ 
setLocationId($(this).attr('id')); 
});

来源

2013-08-28 12:57:45

<ul id="supported-locations"> 
    <li data-id="32">Mexico</li> 
    <li data-id="35">Mongolia</li> 
</ul>

jQuery中

$('#supported-locations').on('click','li',function(){ 
    setLocationId($(this).data('id')); 
})

来源

2013-08-28 12:57:47 Romaindr

当您注册时，你还必须使用此链接到的能力， HTML元素。

换句话说，你仍然可以做这样的事情

<li id="YOUR_ID">Mexico</li>

，并获得L1标签的ID

来源

2013-08-28 12:57:50 Nox

使用.click而不是onclick并获取变量值

回答

相关问题