jQuery如何使用$（this）获得被点击项的价值？
[英]Jquery how to use $(this) to get value of clicked item?
问题描述
I have trouble getting value of particular item that I'd clicked 
我无法获得我点击过的特定物品的价值
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$(document).ready(function(){
$(this).click(function(){
alert($(this).find("button").html());
});
});
</script>
</head>
<body>
<p>test 1</p>
<p>test 2</p>
<button>Yes</button>
<button>No</button>
</body>
</html>
- I'd tried
$(this).find("button").html(), but it will return the value of 1st button("Yes) even if I clicked the 2nd button("No")我试过$(this).find("button").html()，但是即使我单击了第二个按钮（“否”），它也会返回第一个按钮的值（“是”）。 - Same for
$(this).find("p").html(), will return value of 1st与$(this).find("p").html()，将返回值1st - How do I use
$(this)to get the value of item I clicked?如何使用$(this)获得我点击的项目的价值？ - Don't suggest me to insert class or id, I'm not suppose to touch the html. 不要建议我插入class或id，我不应该触摸html。
- Please assist, thanks. 请协助，谢谢。
6 个解决方案
解决方案1
2 已采纳 2016-08-11 03:47:51
It is because $(this).click event listener is added to document object and not any specific html element. 这是因为$(this).click事件侦听器已添加到document对象，而不是任何特定的html元素。
$(document).ready(function(){
$('button,p').on('click',function(){
alert($(this).html());
});
});
plunker: https://jsfiddle.net/wx38rz5L/1743/ 塞子： https ://jsfiddle.net/wx38rz5L/1743/
解决方案2
2 2016-08-11 03:51:57
If you are trying to get each button's html on click, use this. 如果您试图在单击时获取每个按钮的html，请使用它。
$('button').click(function () {
alert($(this).html());
});
解决方案3
2 2016-08-11 03:56:35
this in your click handler is always the document (which you've bound the handler to), so that doesn't help anything. this在点击处理程序始终是文件（你已经绑定的处理程序），这样就不会什么帮助。 Instead, use something like 相反，使用类似
$(document).click(function(e){
if ($(e.target).is("button"))
console.log($(e.target).text());
} else {
console.log("not clicked (directly) on a button");
}
});
or rather just 或只是
$(document).on("click", "button", function(e){
console.log($(this).text());
});
解决方案4
0 2016-08-11 03:54:15
Bind the click event on both button and get the content of the html element with innerHTML . 绑定两个button上的click事件，并使用innerHTML获取html元素的内容。
$(document).ready(function() { $('button').click(function(event) { alert(event.target.innerHTML); }); });
<html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> </head> <body> <p>test 1</p> <p>test 2</p> <button>Yes</button> <button>No</button> </body> </html>
解决方案5
0 2016-08-11 03:54:44
You have to detect which $(this) is binded for ? 您必须检测哪个$（this）被绑定？ Try something like this: 尝试这样的事情：
- Setup an object 设置对象
<button class="btn red btn-xs editbtn" type="button" value="${rs.id}" value="${rs.id}">
- Function for this object 该对象的功能
$(function(){ $('.editbtn').click(function(e){ common.showSpinner(); var idbbpdtd = $(this).val(); }); });
解决方案6
0 2016-08-11 04:06:48
Try this. 尝试这个。
$(document).ready(function() {
$(this).click(function(event) {
alert(event.target.innerHTML);
});
});
In jQuery event.target always refers to the element that triggered the event. 在jQuery中， event.target始终指触发事件的元素。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.