Javascript 如何在不提交表单的情况下将多个变量从HTML网页发送到python脚本

这将是一个奇怪的一个，如果我是诚实的，所以请与我赤裸裸

我目前正在从事一个项目，该项目要求我调用python脚本，该脚本是从网页本身运行HTML网页的Web服务器的一部分，即在网页上移动滑块，它调用python脚本并传递滑块的值和脚本将值传递到其相关端点所需的ID值。在这种情况下，它是一个监视器ID，滑块值是亮度必须设置为的亮度值

目前，我通过表单提交操作实现了这一点，但我不希望网页在发送新值后重置，因此JavaScript是我使用Ajax请求的下一个最佳选择。虽然我取得了一些进展，但我基本上是web开发的新手，遇到了困难

下面是我尝试过的脚本和它调用的python脚本

<script>

    slider.oninput = function (event, ui)
    {

        var slider_val=event.target.id;
        console.log(slider_val);
        $( "#"+slider_val ).val( ui.value );
        $( "#amount_"+slider_val ).val( $( "#"+slider_val ).slider( "value" ) );

        changeBrilliance();

    }

function changeBrilliance(value, monid)
{
    $.ajax({
        type: "POST",
        url: "/brilliancechange",
        data: { mydata: value, mon: monid }
    });
}
</script>

---

如果我每次都想用不同的ID和值调用此方法，而不是每次都重新加载网页，javascript应该是什么样子？

看起来changeBrilliance（）接受两个参数，但调用时没有传递任何内容。我不太熟悉正在使用的Python框架，但只要它在文章正文中接受content type:application/json，您就可以：

// not totally sure which value/id combo you need but just pass the necessary ones here
changeBrilliance(slider_val, ui);

然后，如果您希望浏览器中的某些内容发生更改，则必须在成功时回调“完成”，如果出现错误时回调“失败”，并始终回调应始终发生的某些行为：

$.ajax({
   type: "POST",
   url: "/brilliancechange",
   contentType: "application/json",
   data: JSON.stringify(myObj)
}).done(function(data) {
   // do something 
}).fail(function(jqXHR, textStatus, err) {
   // handle error
}).always(function(data) {
   // always callback
});

---

今天我将尝试一下，看看它是否有意义，谢谢你的贡献，如果它有效，我将把它作为答案。

function changeBrilliance(value, monid)
{
    var myObj = { 'myData': value, 'mon': monid };

    $.ajax({
        type: "POST",
        url: "/brilliancechange",
        contentType: "application/json",
        data: JSON.stringify(myObj)
    });
}

$.ajax({
   type: "POST",
   url: "/brilliancechange",
   contentType: "application/json",
   data: JSON.stringify(myObj)
}).done(function(data) {
   // do something 
}).fail(function(jqXHR, textStatus, err) {
   // handle error
}).always(function(data) {
   // always callback
});