Javascript OnClick 获取“a”标签的“id”属性
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/14673824/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
OnClick get "id" attribute of "a" tag
提问by Jakub Zak
I have list view in jQuery Mobile web app this list view is made of elements like this:
我在 jQuery Mobile Web 应用程序中有列表视图，此列表视图由以下元素组成：
<li id='search_r'>
<a href='#' id='$id' class='s_result'></a>
</li>
<li id='search_r'>
<a href='#' id='$id' class='s_result'></a>
</li>
Number of element depends on number of search results, its not only these two. When I click on element in list view, in this case:
元素的数量取决于搜索结果的数量，而不仅仅是这两个。当我单击列表视图中的元素时，在这种情况下：
<li></li>
I need 2 things to happen, one is to assign the 'id' attr from "a" tag inside this specific "li" tag (the clicked one), to the global variable I have called 'search_r'. The click event works fine, but to get attribute from "a" tag I can't manage to do.
我需要做两件事，一个是将这个特定“li”标签（点击的那个）内的“a”标签中的“id”属性分配给我称为“search_r”的全局变量。点击事件工作正常，但要从“a”标签中获取属性，我无法做到。
Here is my js:
这是我的js：
$("#cc_page").ready(function(){
$("#search_r").live('click', function(){
search_r = $(this).attr('id');
window.location.href = "http://imes.********.com/app/userpanel.html#sfpp_page";
});
});
I know "this" is not solution. I'm really new to js so that's why I'm asking such an ridiculous questions :)
我知道“这个”不是解决方案。我对 js 真的很陌生，所以这就是我问这么荒谬的问题的原因:)
回答by Rory McCrossan
The first problem you've got is duplicate search_rid attributes, which is invalid. These should be changed to classes. Also, you should be using on()with a delegate handler, as live()has been removed from the latest version of jQuery. Try this:
您遇到的第一个问题是重复的search_rid 属性，这是无效的。这些应该更改为类。此外，您应该使用on()委托处理程序，因为live()已从最新版本的 jQuery 中删除。尝试这个：
<li class='search_r'>
<a href='#' id='$id' class='s_result'></a>
</li>
<li class='search_r'>
<a href='#' id='$id' class='s_result'></a>
</li>
$("#cc_page").on('click', '.search_r', function(){
var search_r = $('a', this).attr('id');
console.log(search_r); // just to check it works
// I assume this is just for testing, otherwise leaving the page
// immediately on click renders getting the id completely moot.
//window.location.href = "http://imes.********.com/app/userpanel.html#sfpp_page";
});
I also assume the $idin your HTML is from some form of templating engine which gets interpreted? If not, those will also need to be made unique.
我还假设$id你的 HTML 来自某种形式的模板引擎，它被解释？如果没有，那些也需要变得独一无二。
回答by ROY Finley
.livehas been deprecated in jQuery since v1.7, and has been removed in v1.9.
.live自 v1.7 以来，jQuery 已弃用，并已在 v1.9 中删除。
You should replace it with .on().
您应该将其替换为.on().
.onhas 2 syntaxes for binding elements, whereas .liveonly had 1.
.on有 2 种绑定元素的语法，而.live只有 1 种。
If the element exists at the time you are binding, you do it like this:
如果元素在您绑定时存在，您可以这样做：
$('.element').on('click', function(){
.......
});
You can even use the shorthand:
你甚至可以使用简写：
$('.element').click(function(){
.........
});
If the element does not exist at the time, or new ones will be added (which is what .livewas normally used for), you need to use "event delegation":
如果该元素当时不存在，或者将添加新元素（这是.live通常使用的），则需要使用“事件委托”：
$(document).on('click', '.element', function(){
.............
});
NOTE: You want to bind to the closest static element, not always document.
注意：您希望绑定到最近的静态元素，而不总是document.
In the meantime, the jQuery Migrate plugincan be used to restore the .live()functionality if you upgrade your jQuery to the newest version.
同时，如果您将 jQuery 升级到最新版本，可以使用jQuery Migrate 插件来恢复.live()功能。
回答by dirn
window.location.hrefcauses the browser to make a new request. Any variables will be reset when the new page loads.
window.location.href导致浏览器发出新请求。当新页面加载时，任何变量都将被重置。
What is your goal with search_r?
你的目标是search_r什么？
