来自JavaScript的jQuery Knob和POST请求

时间:2016-08-22 17:25:36

标签: javascript jquery ajax

如何使用带有JavaScript和jQuery Knob的参数形成标准POST请求?

这是我得到的:

index.html

<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="utf-8" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="jquery.knob.min.js"></script>
</head>

<body>
<input type="text" data-angleoffset=-125 data-anglearc=250 data-fgcolor="#66EE66" value="50" class="dial">

<script>
    $(".dial").knob({
    'release' : function (sendpostresp) {
        $.ajax({
            url: "publish.php", //the page containing php script
            type: "POST", //request type
            success: function (result) {
                alert(result);
            }
        });
    }
});
</script>

</body>
</html>

我需要在释放时保存旋钮的值。 PHP部分等待POST并将值保存到数据库,它可以工作。

在我看来,我的代码应该使用POST将旋钮的当前值发送到PHP脚本。但我在控制台中看不到任何参数,只是一个空的POST响应。

不幸的是,official jQuery Knob docs没有提供足够的说明。请帮助我学习代码示例,如何通过POST从jQuery旋钮发送当前值?

1 个答案:

答案 0 :(得分:0)

您只需要向ajax请求添加数据属性即可。它看起来像这样:

$(".dial").knob({
    'release' : function (sendpostresp) {
        $.ajax({
            url: "publish.php", //the page containing php script
            type: "POST", //request type
            data: { 
                foo: sendpostresp 
            },
            success: function (result) {
                alert(result);
            }
        });
    }
});

根据Knob文档,'release'回调函数中的参数是表盘的当前值。只需将它粘贴到ajax请求的数据对象中,它就会被发送到处理请求的服务器端代码