使用选项输出而不是选项值

use option output rather than option value

本文关键字:选项 输出      更新时间:2023-09-26

我设置了一个简单的jquery脚本来计算用户的服务成本。 脚本效果很好!但是,我的数据库端调用另一条路线。如何使用选项的实际输出而不是值进行计算

jquery:

    var $selections = $('#selections');
var $selects = $("select").change(function () {
    var total = 0;
    $selections.empty();
    $selects.each(function () {
        var $selected = $(this).find("option:selected");
        var price = parseFloat($selected.data("price")) || 0;
        total += price;
        if($selected.val() !== ''){
            $('<li />', {
                text: $selected.val() + $(this).parent().clone().children().remove().end().text()+" " + $selected.data("price")
            }).appendTo($selections)
        }
    })
    $(".summary").text('Est. Total $' + total);
})

带有 PHP 的 HTML:

<select name="rooms" id="Areas"> 
<option value="" selected="selected">0</option>
 @foreach ($room as $rooms)
 <option data-price="{{ $rooms->pr_clean }}" value='{{ $rooms->room  }}'>{{ $rooms->room  }}</option>
 @endforeach
</select>

基本上,我希望能够在值字段中添加一些不同的东西以进入数据库,但仍然使用{{ $rooms->room }}计算他们想要选择多少空间

以下是我的脚本如何工作的基本思想的摆弄。 http://jsfiddle.net/arunpjohny/xf9Fp/

在 jQuery 中,.val() 会在 <option> 标记内定义为您提供选项的值。如果选项中没有值,它将获取选项的文本。

<option value="" selected="selected">0</option>
        ^------^                     ^
         value                      text

所以因为你的一些选项有value="",jQuery的.val()将得到这个值,这是一个空字符串。如果<option>标签内部没有value="".val()会给你0

为了确保您始终获得该选项的文本,您可以使用 .text()。

所以使用这个: if($selected.text() !== ''){