首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >请帮助优化和编写获取json数据并将其附加到选择列表选项的Jquery函数

请帮助优化和编写获取json数据并将其附加到选择列表选项的Jquery函数
EN

Stack Overflow用户
提问于 2011-08-14 09:15:39
回答 2查看 236关注 0票数 1

基本上只需要编写一个jQuery/Ajax,它从服务器获取Json数据(Price数据),并附加/覆盖每个选项文本值,以便在其末尾显示所选选项和未选中选项之间的价格差异。只有未选中的选项才会在其末尾显示差价,请参见下面的示例。

你可以在下面的代码中找到这一点,但我似乎无法正确地将其附加/覆盖到选项文本值的末尾,而不是在下拉列表的每次更改时将价格差异重复(而不是替换)到末尾。所以我得到了产品name025252525等。

我也不知道如何不将差异附加到所选的选项文本上,现在我只是在那里得到了"0“,因为它从自身减去了自己。

Json对象(数据)数组的格式为{partid = 3, price = 234}, {partid = 6, price = 53}等。

列表应如下所示:

代码语言:javascript
复制
[Intel i7 950] - selected visible option
[Intel i7 960 (+ $85)] - not selected but in the drop down list
[Intel i7 930 (- $55)] - not selected but in the drop down list



<script type="text/javascript">



    $(document).ready(function () {
        var arr = new Array();
        $('select option').each(function () {
            arr.push($(this).val());
        });






        $.ajax({
            type: "POST",
            url: "/Customise/GetPartPrice",
            data: { arr: arr },
            traditional: true,
            success: function (data) { mydata = data;  OnSuccess(data) },
            dataType: "json"



        });




    });





   $('select').change(function () { OnSuccess(mydata); });


    function OnSuccess(data) {



        $('select').each(function () {


            var sov = parseInt($(this).find('option:selected').attr('value')) || 0; //Selected option value

            var sop; //Selected Option Price


            for (i = 0; i <= data.length; i++) {


                if (data[i].partid == sov) {

                    sop = data[i].price;
                    break;
                }


            };









            $(this).find('option').each(function () {

                // $(this).append('<span></span>');

                var uov = parseInt($(this).attr('value')) || 0; //Unselected option value

                var uop; //Unselected Option Price


                for (d = 0; d <= data.length; d++) {


                    if (data[d].partid == uov) {

                        uop = data[d].price;
                        break;
                    }

                }

                var newtext = uop - sop;



                    var xtext = $(this).text().toString();
                    $(this).attr("text", xtext + newtext);


                // mob.append(newtext)
                // $(this).next('span').html(newtext);


            });







        });


    };




   //$(document).ready(function () { $("#partIdAndCount_0__PartID").prepend('<option value="0">Select Processor<option>'); });


</script>
EN

回答 2

Stack Overflow用户

发布于 2011-08-14 09:18:37

你已经接近了:

代码语言:javascript
复制
        $.ajax({
            type: "POST",
            url: "/Customise/GetPartPrice",
            data: { arr: arr },
            traditional: true,
            success: OnSuccess,
            dataType: "json"
        });

OnSuccess是一个接受一个参数data的函数。所以您只需使用上述方法即可。

如果像$('select').change(OnSuccess(data));一样修复,$('select').change(OnSuccess(data););将会编译,去掉函数中的分号。但是,这将立即执行OnSuccess。再说一次,$('select').change(OnSuccess);是您想要的。

票数 1
EN

Stack Overflow用户

发布于 2011-08-14 09:22:24

声明一个变量以将其存储在外部作用域中:

代码语言:javascript
复制
var theJSON;

$(document).ready(function () {
        var arr = new Array();
        $('select option').each(function () {
            arr.push($(this).val());
        });


        $.ajax({
            type: "POST",
            url: "/Customise/GetPartPrice",
            data: { arr: arr },
            traditional: true,
            success: function (data) { theJSON = data; OnSuccess(theJSON)},
            dataType: "json"

        });
});

$('select').change(function(){ OnSuccess(theJSON); });
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/7054349

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档