Question

嘿伙计们我在这里有一些代码，我似乎无法正常工作或我的逻辑没有意义。我需要创建一个多选框，允许用户选择他们想要披萨的配料。反过来，每次打顶都是我计算的0.50美分的额外费用。因此，如果用户只想要一个打顶，它只会额外增加0.50美分。因此，如果用户选择选项2或3或甚至1和4，则结果与浇头的价格相同。

任何帮助将不胜感激！

以下是新HTML：

<label for='top'>Toppings:</label>
                    <div class="ui-field-contain">
                            <select name="top" id="top" multiple="multiple" data-native-menu="false">
                                <option>Choose Toppings</option>
                                <option value="1">Sausage</option>
                                <option value="1">Pepperoni</option>
                                <option value="1">Mushroom</option>
                                <option value="1">Bell Pepper</option>
                                <option value="1">Onions</option>
                            </select>
                    </div>

JS：

var top = $("#top").val();      
var priceTop = '';

        if (top == 1)
        {
        priceTop = '.50';
        }
        else if (top == 2)
        {
        priceTop = '1.00';
        }
        else if (top == 3)
        {
        priceTop = '1.50';
        }
        else if (top == 4)
        {
        priceTop = '2.00';
        }
         else if (top == 5)
        {
        pricetop = '2.50';
        }

最初这是我的代码，用于确定选择了哪些浇头，但我发现如果我将HTML上的值保留为1，则会改变我的计算。所以现在我必须通过这个。 旧HTML

<label for='top'>Toppings:</label>
                    <div class="ui-field-contain">
                            <select name="top" id="top" multiple="multiple" data-native-menu="false">
                                <option>Choose Toppings</option>
                                <option value="1">Sausage</option>
                                <option value="2">Pepperoni</option>
                                <option value="3">Mushroom</option>
                                <option value="4">Bell Pepper</option>
                                <option value="5">Onions</option>
                            </select>
                    </div>

Answer 1

jQuery Mobile中的多个非本机select值.val()会返回数组。该数组的.length表示所选的总选项。 .length多个0.5以获得最终价值。

$(document).on("pagecreate", function () {
    $("#top").on("change", function () {
        if ($(this).val() != null) {
            console.log($(this).val().length * 0.5 + " USD");
        } else {
            console.log("No toppings.");
        }
    });
});

<强> Demo

JQM选择列出多个选项并获取值

1 个答案: