jQuery Slider更改事件和加载功能

Question

我有一个价格滑块，想在用户更改价格滑块时重新加载内容。 但是，当事件触发并且加载功能生效时，出现以下错误

TypeError: 'stepUp' called on an object that does not implement interface HTMLInputElement.

这是我的代码

    $(".range-filter").on('slidechange', function(){

    var formdata = $("#filterList").serializeObject();
    var attrfilter = $("#filterList").find('input[name^=attrfilter]:checked');
    alert("yey");

    $("#productList").load(
        url,
        { 
            formdata: formdata,
            attrfilter: attrfilter
        },
        function(responseText, statusText, xhr){
            if(statusText == "success")
                return;
            if(statusText == "error")
                return;
        }
    );
});

为什么这会引起冲突？ 我应该改用普通的ajax功能吗？

Answer 1

记录formdata和attrfliter以查看它们是否是有效值，可以在对象（装入函数中的第二个参数）中给出该值，以作为Ajax调用的数据发送。

var attrfilter = $("#filterList").find('input[name^=attrfilter]:checked');

我相信以上内容正在造成问题。 attrfilter将是jQuery DOM元素对象，不是true或false ，我想您会希望为Ajax调用传递数据。

您可以做的是：

var attrfilter = $("#filterList").find('input[name^=attrfilter]').prop("checked")
// will return true or false

---

另请参阅：

TypeError：在未实现接口HTMLInputElement的对象上调用stepUp

TypeError：'stepUp'在未实现接口HTMLInputElement的对象上调用

Answer 2

是的，我忘记了映射这样的值：

        attrfilter = $.map(attrfilter, function(element) 
    {
        var start = element.name.indexOf('[')+1;
        var end = element.name.indexOf(']');
        return {id: element.name.substring(start, end), value: element.value};
    });