使用Ajax发送数据Jquery
Sending Data with Ajax & Jquery
编辑修复-问题解决
上下文:我试图创建一个页面,单击图像更改用户在服务器上的首选项。尝试使用ajax发送信息而不刷新页面,并使用Jquery触发发布。
问题:似乎什么都没有张贴。似乎ajax没有将数据发送到data.php文件。
预期动作: 当图像被点击时,父母的id将被张贴在该用户的游戏列中。
header。php
<script type="text/javascript">
$(document).ready(function(){
$(".pickteam").click(function() {
var game = $(this).parent().attr('data-id');
$.ajax
({
url: 'data.php',
data: {game: game},
type: 'post',
});
});
});
</script>
index . php
<div class="col-md-3 team1 otherteam" data-id="m004">
<button class="pickteam">
<img src="http://img.fifa.com/images/flags/4/bra.png" alt="Brazil">
</button>
<span class="country">BRAZIL</span>
</div>
data.php
$game = $_POST['game'];
mysqli_query($con, "INSERT INTO choices (user, game) VALUES ('12345', '$game')");
提前感谢所有的帮助。
我猜你没有得到你的数据id正确,因为你的jQuery代码应该是var game = $(this).parent().attr('data-id');
,所以把它们放在一起:
<script type="text/javascript">
$(".pickteam").click(function() {
var game = $(this).parent().attr('data-id');
$.ajax
({
url: 'data.php',
data: {game: game},
type: 'post'
});
});
</script>
使用var game = $(this).parent().attr('data-id');
从父div
和删除额外的逗号从你的ajax函数附近的type : "post",
,所以最终的代码应该是:
<script type="text/javascript">
$(document).ready(function(){
$(".pickteam").click(function() {
var game = $(this).parent().attr('data-id');
$.ajax
({
url: 'data.php',
data: {game: game},
type: 'post'
});
});
});
</script>
你需要使用
var game = $(this).parent().attr('data-id');
获取data-id属性的值。目前还不清楚到底是哪里出了问题。你能否提供更多关于你被困在哪里的细节?
您只需要将您的代码包装在Document ready包装器中:
<script type="text/javascript">
$(document).ready(function(){
$(".pickteam").click(function() {
var game = $(this).parent().data('id');
$.ajax
({
url: 'data.php',
data: {game: game},
type: 'post',
});
});
});
</script>
相关文章:
- 用程序搜索JQuery数据表中的文本
- 使用jquery将mysql数据获取到新的表行中
- jQuery最近父级的数据属性选择器
- 用我的json数据填充JQuery DataTable
- jquery创建的数据-*有时无法解析
- Jquery在触摸屏上添加类和数据
- 使用jquery读取Json数据
- 使用Javascript/JQuery获取JSON GET数据
- 如何使用jquery ajax和jsonp在您自己的域上读取json数据
- Jquery:对返回JSON数据的php脚本的Ajax调用
- Jquery(多读/少读)在从数据库加载整个数据后不起作用
- 获取单字段数据Jquery
- 验证数据 jQuery Handsontable 输入
- 带有自定义格式的C#Web服务json数据jquery ui
- 过帐表单数据Jquery
- 在文档准备好之前从服务器获取AJAX数据(jQuery)
- 使用ajax获取数据jquery
- 将格式数据jquery从long更改为short
- 使用Ajax发送数据Jquery
- 获取文本区域和文本字段数据- jquery