Question

我在这里有这个javascript，它应该根据选择的选择框来显示/隐藏div。当我尝试将其插入数据库时，它只插入最后一个选项（paypal）。

例如，如果我选择现金选项，它将在数据库中插入一个空白字段。如果我选择Paypal它将插入它..其他选项也是如此。只插入了Paypal。

（我为我糟糕的英语和意大利面条代码道歉）

$(document).ready(function(){
    $("#payment").change(function(){
        $(this).find("option:selected").each(function(){
            if($(this).attr("value")=="bank"){
                $(".box1").not(".bank").hide();
                $(".bank").show();
            }
            else if($(this).attr("value")=="cash"){
                $(".box1").not(".cash").hide();
                $(".cash").show();
            }
            else if($(this).attr("value")=="cheque"){
                $(".box1").not(".cheque").hide();
                $(".cheque").show();
            }
            else if($(this).attr("value")=="invoice"){
                $(".box1").not(".invoice").hide();
                $(".invoice").show();
            }
            else if($(this).attr("value")=="paypal"){
                $(".box1").not(".paypal").hide();
                $(".paypal").show();
            }
            else{
                $(".box1").hide();
            }
        });
    }).change();
});

<style type="text/css">
    .box{
        display: none;
      }
    .box1{
        display: none;

    }
    .income{ background: #fff; }
    .expense{ background: #fff; }
    .blue{ background: #fff; }
    .cash{ background: #fff; }
    .card{ background: #fff; }
    .cheque{ background: #fff; }
</style>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="form-group">
             <div class="input-group">
                <span class="input-group-addon"><span class="glyphicon glyphicon-user"></span></span>
                 <select id="payment" name="payment_type" class="form-control" required>
                 <option value="" disabled selected>Select Payment Type</option>
                 <option value="bank">Bank Transfer</option>
                 <option value="cash">Cash</option>
                 <option value="cheque">Cheque</option>
                 <option value="invoice">Invoice</option>
                 <option value="paypal">Paypal</option>
                 </select>

            </div></div>

            <div class="form-group bank box1">
             <div class="input-group">
                <span class="input-group-addon"><span class="glyphicon glyphicon-envelope"></span></span>
             <input type="text" name="transaction_amount" class="form-control" placeholder="Bank Account" maxlength="40"  />
                </div>
                
            </div>

            <div class="form-group cash box1">
             <div class="input-group">
                <span class="input-group-addon"><span class="glyphicon glyphicon-envelope"></span></span>
             <input type="text" name="transaction_amount" class="form-control" placeholder="Cash Amount" maxlength="40"  />
                </div>
                
            </div>

            <div class="form-group cheque box1">
             <div class="input-group">
                <span class="input-group-addon"><span class="glyphicon glyphicon-envelope"></span></span>
             <input type="text" name="transaction_amount" class="form-control" placeholder="Cheque Reference" maxlength="40"  />
                </div>
                
            </div>   

            <div class="form-group invoice box1">
             <div class="input-group">
                <span class="input-group-addon"><span class="glyphicon glyphicon-envelope"></span></span>
             <input type="text" name="transaction_" class="form-control" placeholder="Invoice Number" maxlength="40"  />
                </div>
                
            </div>    

            <div class="form-group paypal box1">
             <div class="input-group">
                <span class="input-group-addon"><span class="glyphicon glyphicon-envelope"></span></span>
             <input type="text" name="transaction_amount" class="form-control" placeholder="Paypal Reference" maxlength="40"  />
                </div>
                
            </div>

Answer 1

使用样式display: none时，您只隐藏输入。它仍然发送提交。 Paypal是最后一个，所以最后一个值是什么都没有，因为你没有在隐藏输入中写任何东西。您必须将输入的名称更改为个人。

Answer 2

您的问题在于将所有输入字段命名为相同的内容。这将混淆服务器端的PHP脚本，因为输入名称是它区分值的方式。您可能想尝试只为交易金额设置一个输入字段，并以其他方式指示付款。

使用javascript .change函数时无法保存到数据库

2 个答案: