jQuery 将动态 id 值传递给函数
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/25614341/
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
jQuery pass dynamic id value to function
提问by user3047382
Im new at JS/jQuery.
我是 JS/jQuery 新手。
I got this code:
我得到了这个代码：
<button id="value1" class="buttonkontakte" onclick="kontakte()">KLICK1</button>
<button id="value2" class="buttonkontakte" onclick="kontakte()">KLICK2</button>
<button id="value3" class="buttonkontakte" onclick="kontakte()">KLICK3</button>
jQuery:
jQuery：
function kontakte(){
var getthevalue = ???????????????;
$.ajax({
type: 'post',
url: 'post.php',
data: {wasmachen: "kontakte", value: getthevalue},
success: function(msg) {
$('#kontakte').html(msg);
}
});
}
Now when I click on KLICK1 I want to pass "value1" to the var getthevalue. How can I do that?
现在，当我单击 KLICK1 时，我想将“value1”传递给 var getthevalue。我怎样才能做到这一点？
回答by Wilfredo P
Simple pass thisinside the html onclickto know Who called the function like:
简单地this在 html 内部传递onclick即可知道谁调用了该函数，例如：
<button id="value1" class="buttonkontakte" onclick="kontakte(this)">KLICK1</button>
<button id="value2" class="buttonkontakte" onclick="kontakte(this)">KLICK2</button>
<button id="value3" class="buttonkontakte" onclick="kontakte(this)">KLICK3</button>
And the function get the value like:
该函数获得如下值：
function kontakte(e){
var getthevalue = $(e).attr('id');
$.ajax({
type: 'post',
url: 'post.php',
data: {wasmachen: "kontakte", value: getthevalue},
success: function(msg) {
$('#kontakte').html(msg);
}
});
}
回答by andrew
Please get rid of those ugly inline javascript event handlers
请摆脱那些丑陋的内联 javascript 事件处理程序
$('.buttonkontakte').click(function(){
value=$(this).attr('id');
$.ajax({
type: 'post',
url: 'post.php',
data: {wasmachen: "kontakte", value: value},
success: function(msg) {
$('#kontakte').html(msg);
}
});
});
回答by Sluijsens
This can be done by handling the click with jQuery like so:
这可以通过使用 jQuery 处理点击来完成，如下所示：
$(document).ready(function() { // Start of the block of jQuery code
// Define a function which needs a parameter
function kontakte(getthevalue) {
$.ajax({
type: 'post',
url: 'post.php',
data: {wasmachen: "kontakte", value: getthevalue},
success: function(msg) {
$('#kontakte').html(msg);
}
});
}
// Handling the on click event via jQuery instead of HTML
$("#value1").click(function() {
// Call your function with a parameter now.
kontakte("value1");
// Or if you want the passed value to be the same as the id of your button
var value = $(this).attr('id');
kontakte(value);
}
} // end jQuery
Your HTML will look like:
您的 HTML 将如下所示：
<button id="value1" class="buttonkontakte">KLICK1</button>
<button id="value2" class="buttonkontakte">KLICK2</button>
<button id="value3" class="buttonkontakte">KLICK3</button>
With this, you will handle everything in jQuery since, as far as I am concerned, you cannot call a function in the onclickattribute when the function is declared inside a jQuery block. (Please correct me if I am wrong)
有了这个，您将处理 jQuery 中的所有内容，因为就我而言，当函数在 jQuery 块中声明时，您不能在onclick属性中调用函数。（如果我错了，请纠正我）
I hope this helps!
我希望这有帮助！
