0

我正在尝试使用 ajax 获取 javascript 变量(并最终将其获取到 php)。我已经尝试了几件事。我试图在用户更改它后立即获取 Jquery 范围滑块的值(以便稍后保存值)。这是javascript:

$("#slider").bind("userValuesChanged", function(e, data){
  console.log( + data.values.min );
});

一旦我更改了最小滑块,日志就会输出正确的值。现在我正在尝试使用 ajax 获取这个 userValuesChanged:

  $.ajax({
   type: "GET",
   dataType: "json",
   url: "test.php",
   data: "{userValuesChanged}",
   async: false,
   success: function(data){
     alert(data);
     return true;
   }
 });

好吧,这是我第一次使用 ajax,这是行不通的。我不确定如何在数据标签上写入正确的值。如何获取 userValuesChanged?还是具体的 + data.values.minv 值?

4

2 回答 2

2

在您的ajax通话中,您只是发送字符串"{userValuesChanged}"

如果要发送新值,请在对象中指定这些值:

$("#slider").bind("userValuesChanged", function (e, data) {
    $.ajax({
        type: "GET",
        dataType: "json",
        url: "test.php",
        data: { minValue: data.values.min },
        async: false,
        success: function (data) {
            alert(data);
            return true;
        }
    });
});

上面的关键位是:

data: { minValue: data.values.min },

...它创建了一个对象,该对象具有一个名为的属性,该属性minValue设置为data.values.min您从滚动条接收到的值。您的服务器端脚本将查找名为minValue. (当然,如果您还想要来自 的其他值data.values,也可以包含它们。)


但是,每次滑块更改时都这样做可能有点多。如果userValuesChanged事件只触发一次,当值停止变化时,上面的绝对没问题。如果它在用户移动滚动条时不断触发,那就不好了,因为你会触发很多ajax调用。

如果是这种情况(当用户更改值时它会重复触发),请查看当用户停止更改时它是否提供不同的事件。

如果没有,您可以改为限制速率。如有必要,请执行以下操作:

$("#slider").bind("userValuesChanged", function (e, data) {
    saveNewValues(data.values.min);
});

var pendingSaveTimer = 0;
function saveNewValues(minValue) {
    // cancel any previous save we have pending
    clearTimeout(pendingSaveTimer);
    pendingSaveTimer = 0;

    // Schedule saving the new value in half a second
    pendingTimer = setTimeout(function() {
        // Clear our timer var
        pendingTimer = 0;

        // Do it
        $.ajax({
            type: "GET",
            dataType: "json",
            url: "test.php",
            data: { minValue: minValue },
            async: false,
            success: function (data) {
                // Do something here if needed
            }
        });
    }, 500); // 500 = 500 milliseconds = half a second
}

在保存值之前等待半秒,如果在半秒内有新值进入,则取消保存。

于 2013-07-04T10:59:16.070 回答
0

试试喜欢

$.ajax({
     type: "GET",
     dataType: "json",
     url: "test.php",
     data: {userValuesChanged:userValuesChanged},
     async: false,
     success: function(data){
           alert(data);
          return true;
      }
 });

{key : value}当您通过 ajax 发送数据时,数据应该类似于格式

于 2013-07-04T10:55:37.557 回答