如果没有找到数据，则将选择值更改为 null答案

【问题标题】：Change select value to null if there is no data found on it如果没有找到数据，则将选择值更改为 null
【发布时间】：2016-05-18 02:25:33
【问题描述】：

如果在选择字段中找不到数据量，我想将所选值更改为 null。例如，我在数量字段中输入 10 在我的选择选项标签中没有 data-quantity = "10" 所以它应该为空并且总价格应该等于 0 。

商品价格：

 <input type="hidden" name="price" id="price"class="price" value="<?php if($price!=""){echo $price;}else{echo $shop_item_orig_price;}?>">

数量：

<input type="number" name="quant" id="quant" /> // for example I enter 2

发货详情：

<select name="shipment" disable>
 <option value="100"  data-quantity="1"> 100 per 1 item </option>
 <option value="150"  data-quantity="2"> 150 per 2 item </option> //this must be selected
</select>

<script>
function myFunction(quantInput)
{
  var price = document.getElementById("price");
  var quantity = document.getElementById("quant");
  var shipment = document.getElementById("shipmentSelect");
  var total = document.getElementById("total");
    $("#shipmentSelect").find("option[data-quantity=" + quantInput + "]").attr('selected', 'selected').siblings().removeAttr('selected');
  var shipmentValue = shipment.value;
  salePrice = price.value;
  var totalPrice = (salePrice*quantInput) + parseInt(shipmentValue);
  total.value = totalPrice;
}
</script>

总价：

<input id="total" name="answer" style="margin-top:10px;margin-left:5px;"readonly />

【问题讨论】：

你能创建一个 FIDDLE 吗？
为什么不允许 10 个？有限制吗？ 10 是 2 个数量的 5 个订单。
此外，使用 javascript 来指示不允许的内容可能很好，但您应该在服务器端进行检查。很多 Web 开发人员都知道如何绕过 javascript 安全性。
当然...我可以使用 codeigniter 对其进行检查 :) 用于前端验证的用户 html5 验证

标签： javascript php html

【解决方案1】：

我认为您正在寻找类似的东西

<input type="number" name="quant" value="" id="quant" />
<select name="shipment" class="select_custom" disable>
    <option value="100"  data-quantity="1"> 100 per 1 item </option>
    <option value="150"  data-quantity="2"> 150 per 2 item </option> //this must be selected
</select>

<input type="hidden" name="price" id="price"class="price" value="<?php if($price!=""){echo $price;}else{echo $shop_item_orig_price;}?>">

<script>
    $(document).ready(function () {
        $("#quant").focusout(function () {
            var qty = $(this).val();
            var price = $("#price").val();
            $(".select_custom option").each(function () {
                console.log($(this).attr('data-quantity'));
                if ($(this).attr('data-quantity') == qty) {
                    $("#quant").val(qty);
                    $("#price").val(price);
                    return false;
                } else {
                    $("#quant").val(0);
                    $("#price").val(0);
                    $(".select_custom").append('<option value=null selected>Null</option>').selectmenu('refresh');
                }
            });
        });
    });
</script>

检查工作jsfiddle

【讨论】：