我正在尝试为不同的HTML <button>
元素编写不同的PHP代码,但显然它适用于页面上的所有按钮。这是我的一个按钮:
<button name="plus" id="plus" type="button" onclick="plus()">+</button>
这是我尝试制作的函数,它适用于页面上的所有按钮:
$(document).ready(function() {
$("button").click(function() {
$.ajax({
type: 'POST',
url: 'plus.php',
success: function(data) {
//
}
});
});
});
问题:
如何为特定按钮编写函数?
为什么我必须编写 type="button" 才能让它们工作?
在哪里编写 AJAX 函数?在
<head></head>
或身体的任何地方?
1) 如何为特定按钮编写函数?
您可以通过在button
元素上放置特定的 id 或类来执行此操作,以便您可以一次选择单个元素或组。例如,$('#plus')
将仅面向 HTML 示例中的 id="plus"
元素。
2)为什么我必须写type="button"才能工作?
这是因为按钮的默认type
是 submit
。因此,如果按钮在form
它将在您的JS有时间完成之前提交表单。
3) 我在哪里编写 AJAX 函数?在头部或身体的任何部位?
两者都很好,但如果将其放在<head>
请确保将代码放在 document.ready 处理程序中。
最后,我建议您删除HTML中的onclick="plus()"
属性。您似乎没有使用它,即使您是,通过 JS 附加事件被认为是比使用过时事件属性更好的做法。
当然它将应用于所有按钮,因为您选择了所有按钮在Jquery中,当你选择一个特定的元素时,你必须使用一个id,为了选择一个id,在你的情况下,你可以这样做。
$(document).ready(function(){
$("#plus").click(function(){
$.ajax({
type: 'POST',
url: 'plus.php',
success: function(data) {
//
}
}); }); });
它现在可以工作
首先,您已经指定了单击按钮时要调用的方法,属性onclick
执行此操作,因此当有人单击该按钮时,将调用函数 plus。
如果你想用jQuery做到这一点,请使用click(function(event){...});
下一个
为什么我必须编写 type="button" 才能让它们工作?
如果您不使用该type="button"
不会有什么坏处,当您想使用它时会使用它 <button>...</button>
,对于提交表单,type
的默认值仅为button
,
在哪里编写 AJAX 函数?在
<head></head>
或身体的任何地方?
您需要在脚本中编写该 ajax 部分,您可以将<script></script>
放在您的身体或头部,任何您想要的地方。
所以 ajax 的东西看起来像,
<script>
$.ajax({
....
});
</script>