我希望能够使用 AJAX 调用更新页面，用户可以在其中将一些参数传递到输入字段，然后从数据库中检索“onclick”数据并更新页面。
所以基本上我想将用户在某些字段中输入的值传递给 jQuery .on(click) 事件。
然后路由处理程序可以使用这些，以便根据用户的输入过滤从数据库中显示的结果。
当前设置如下 - 我们如何在按钮点击时传递输入字段数据？
在 functions.js 中:
$(function() {
$('button').on('click', function () {
alert('Your parameters are :'+ $(this).data('value'));
$.ajax({
type: 'GET',
url: '/orders',
success: function(result) {
var html = '';
for (var i = 0; i< result.length; i++) {
html += '<h2>' + result[i].id + ' ' + result[i].product + '</h2>';
}
$('#target').html(html);
}
});
});
});
在 ajax.ejs 中:
<body>
<h1>Ajax</h1>
<input type="text" form="myform" />
<button form="myform" >Get Orders</button>
<div id="target">
</div>
</body>
在 orders.js 中:
module.exports = {
orders: function(req, res){
db.query('select * from orders', function(err,result){
if(err){
console.log(err);
}
res.send(result)
});
},
};
最佳答案
你说“......基本上我想将用户输入某些字段的值传递给 jQuery .on(click) 事件。”
好的，使用 jQuery 捕获一些用户输入的方法是这样的:
var input = $(<element-selector>).val();
您可以像这样在事件处理函数中使用该代码:
$('button').on('click', function (e) {
var input = $(<element-selector>).val();
$.ajax({
type: 'GET',
url: '/orders?param=' + input,
success: function(result) {
var html = '';
for (var i = 0; i< result.length; i++) {
html += '<h2>' + result[i].id + ' ' + result[i].product + '</h2>';
}
$('#target').html(html);
}
});
});
由于您有 GET 类型的请求，您可以传递附加在查询字符串中的数据，如您在 url 参数定义中所见。
关于javascript - 是否可以将参数传递给 jQuery .on 处理程序？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/59109833/