5

请通过下面的小提琴。我正在尝试获取fcbkcomplete框中所选产品的 id，并将其显示为文本框中的逗号分隔值id="interest"。我写了一个函数来实现这一点，但它没有用。该函数添加第一个值的 id，而不采用添加到多选框中的其他值的 id。

http://jsfiddle.net/balac/xDtrZ/1/

我已经添加了json.txt. 它包含这样的数据

[{"key":"2", "value":"Canon Powershot "},{"key":"3", "value":"Fastrack Bag"},{"key":"4", "value":"Iphone 4 "},{"key":"5", "value":"Levis Jeans"},{"key":"7", "value":"Indig"},{"key":"8", "value":"Dashing Cars"},{"key":"9", "value":"dsdas"},{"key":"10", "value":"fsfs"}]

在上面的 json 值键是我想在文本框中显示为逗号分隔值的 id。value 是将要出现在下拉列表中以供选择的值。

在下拉列表中选择值时，我希望将相应的键作为逗号分隔值添加到文本框中。

问题是只有第一个选定项目的键被添加到文本框中，无论如何。

希望是具体的，并详细说明。如果有人想要任何澄清，请问我，我会解释更多。

4

2 回答 2

3

我想我为你找到了一个更简单的解决方案。请记住，由于我在评论中提到的问题，我不得不大幅简化您的fcbkcomplete代码以使其正常工作..

$(document).ready(function() {
    $("#select3").fcbkcomplete({
        addontab: true,
        maxitems: 10,
        input_min_size: 0,
        height: 10,
        select_all_text: "select",
        onselect: clicker
    });
});

var clicker = function() {
    var selected = new Array();

    $('option', this).each(function() {
        selected.push($(this).val());
    });

    $('#interest').val(selected.join(', '));
};

在这里查看它的实际应用。

注意：我必须手动添加<option>'s到select列表中才能fcbkcomplete真正正常工作。但是，无论如何，我的逻辑应该对你有用。

此外，fcbkcomplete显然动态地将<option>'sid 更改为类似的东西，opt_vaQDzJU37ArScs818rc8HUwz9gm1wypP所以我不得不使用该值。如果您死心塌地使用 id 而不是 value，则有一些解决方法。

为了说明我的观点，通过每个选项修改循环，如下所示：

$('option', this).each(function() {
    for (var i = 0; i < this.attributes.length; i++) {
        var pair = this.attributes[i].name + ': '
            + this.attributes[i].value;
        alert(pair);
    }
    selected.push($(this).val());
});

您将看到属性在fcbkcomplete运行后如何结束。

最终编辑

在本地主机上设置并使用 JSON txt 文件后，我终于能够复制您遇到的问题。问题是，当您使用 JSON 而不是对<option>s 进行硬编码时，行为会完全改变。这是您的工作解决方案：

$(document).ready(function() {
    var clicker = function(e) {
        var selected = new Array();

        // using "this" here was out of context, use #select3
        $('option', $('#select3')).each(function() {
            selected.push(this.value);
        });

        $('#interest').val(selected.join(', '));
    };

    $("#select3").fcbkcomplete({
        json_url: "parseJSON.txt",
        addontab: true,
        maxitems: 10,
        input_min_size: 0,
        height: 10,
        select_all_text: "select",
        onselect: clicker
    }); 
});
于 2011-11-26T09:52:38.837 回答
0

下面的链接是在选择时在 fcbkcomplete 中获取值的示例。您可以为 id 执行相同的过程。 https://github.com/emposha/FCBKcomplete/issues/110 示例如何使用：

`//自动完成jquery从这里开始
     $("#box").fcbkcomplete({
                    宽度：250，
                    插件表：是的，                   
                    最大项目数：1，
                    input_min_size: 0,
                    高度：10，
                    缓存：真，
                    过滤器案例：真，
                    过滤器隐藏：真，
                    filter_selected：真，
                    纽埃尔：是的，
                    过滤器案例：假，
                    onselect：功能（项目）
                    {
                        获取_value_dealer(item._value, item._id);
                    }
                });
    //自动完成jquery到此结束
`
于 2015-12-07T06:51:57.753 回答