React JS - 在onClick事件后触发PHP
React JS - Trigger PHP after onClick event
我试图通过 react js 脚本的 AJAX 调用或在 react 组件中单击提交按钮时调用 PHP 脚本。我使用普通的 HTML 和 JQuery 完成了此操作,但发现很难使用 react 实现相同的内容。
其中一位用户解释了正常的输入流程并将其显示为警报。但是我希望将输入值发送到PHP脚本。JQuery 代码是:
$('#button').click(function () {
alert("first")
$.ajax({
type: "GET",
crossDomain: true,
url: "http://localhost:8085/Folder1/login.php",
data: {
stime: $("#demo1").val(),
etime: $("#demo2").val(),
desc: $("#servername").val()
},
success: function(data){
alert(data)
$('#resultip').html(data);
},
error:function(data)
{
alert("Data sending failed");
}
});
我是新手反应,无法获得任何解释此操作的文档。任何帮助都非常感谢。
https://jsfiddle.net/69z2wepo/34020/
你可以在 React JS 的提交事件中向你的 PHP 脚本发出 GET 请求,你可以把你的 AJAX 调用放在handleSubmit()
此外,由于您正在发出GET请求,因此您不必将其设置为JSON,因此您可以将参数直接发送到外部脚本,参数将附加到URL中,如下所示GET /test_url.php?first_name=John&last_name=Doe
然后您可以使用$_GET['first_name']
在PHP代码中访问这些参数
handleSubmit(event) {
event.preventDefault();
var data = this.state;
$.ajax({
type: "GET",
crossDomain: true,
url: "http://localhost:8085/Folder1/login.php",
data: {
stime: $("#demo1").val(),
etime: $("#demo2").val(),
desc: $("#servername").val()
},
success: function(data){
alert(data)
$('#resultip').html(data);
},
error:function(data)
{
alert("Data sending failed");
}
});
},
您可以检查控制台以查看对脚本的 GET 请求,
这是更新的小提琴:https://jsfiddle.net/9qewutqk/2/
相关文章:
- php代码在textbox更改事件上显示null
- 执行php函数的onclick事件的其他替代方案
- 如何使用javascript和PHP动态触发onChange事件
- 如何使用OnClick事件通过参数调用来调用PHP函数
- chrome中的onmouseover(下拉选项标记)事件不起作用-php,javascript
- 在动态加载的PHP表单上放置JavaScript事件
- 在按钮'上运行PHP代码;s onclick事件,或者使用Ajax
- 如何在 PHP 中使用 OnChange 事件的下拉列表中选择一个选项后,对大量数据行设置分页
- 从 PHP 获取当前页面 ID 后调用 jQuery 事件
- php代码中的onmouseover和onmouseout事件;不起作用
- 在onclick事件上运行PHP代码
- 包含的javascript源代码通过PHP,onmousemove事件,函数未定义
- 翻译一篇文章'上.单击'PHP中的事件,来自'window.open'到基本URL链接
- HTML onkeyup事件属性来运行PHP函数
- onKeyUp 事件计算不适用于 PHP 生成的表单中的以下行,除了第一行
- 在php中,使用正则表达式的函数中的Onclick事件
- OnClick事件中的PHP脚本
- 为什么 Javascript 事件处理程序会更改我的 PHP 变量
- PHP 在 onclick 事件中获取内容
- Javascript/PHP事件更新注册按钮