如何使用javascript在dropdownlist中使用方法?

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了如何使用javascript在dropdownlist中使用方法?相关的知识,希望对你有一定的参考价值。

我必须通过从下拉列表中选择一个项目来显示/关闭字段。我在javacript中创建了一个函数,但它不能正常工作。这是我的下拉列表的代码:

<div id="payMethod" class="form-group">
            <div class="row">
                <div class="col-lg-12">
                    <label for="paymentMethod">Verificatiemethode</label>
                    <select class="btn btn-primary btn-block bg-primary" data-toggle="dropdown"
                            aria-haspopup="true" aria-expanded="false" id="paymentMethod" name="paymentMethod" onclick="showMethod()">
                        <option value="<?= $paymentRow['methode'] ?>"><?=$sellerRow['controle_optie_naam']?></option>
                        <?= $paymentList = getPaymentMethods($dbh) ?>
                    </select>
                </div>
            </div>
        </div>

这是我用javascript编写的函数来从下拉列表中获取每个项目并使用该项目我试图隐藏/显示文本字段。

var payNumber = document.getElementById("payNumber");
var payMethod = document.getElementById("payMethod");
var bank = document.getElementById("selectBank");
var ccNumber = document.getElementById("ccNumber");
var sellerIndicBox = document.getElementById("sellerIndicBox");
var updateSeller = document.getElementById("updateSeller");
var paymentMethod = document.getElementById("paymentMethod");
var selectedValue =paymentMethod.options[paymentMethod.selectedIndex].value;

function showMethod(){
    switch(selectedValue){
        case "Creditcard":
            payMethod.style.display = "block";
            bank.style.display = "block";
            ccNumber.style.display = "block";
            updateSeller.style.display = "block";
            payNumber.style.display = "none";
            break;

        case "Post":
            payMethod.style.display = "block";
            payNumber.style.display = "none";
            bank.style.display = "none";
            ccNumber.style.display = "none";
            updateSeller.style.display = "none";
            break;

        case "iDeal":
            payMethod.style.display = "block";
            payNumber.style.display = "block";
            bank.style.display = "block";
            ccNumber.style.display = "none";
            updateSeller.style.display = "none";
            break;

        default:
            payMethod.style.display = "block";
            payNumber.style.display = "block";
            bank.style.display = "block";
            ccNumber.style.display = "block";
            updateSeller.style.display = "block";
    }
}
答案

尝试将select的事件更改为onchange()

以上是关于如何使用javascript在dropdownlist中使用方法?的主要内容,如果未能解决你的问题,请参考以下文章

帮助将 DropDown 事件更改为单选按钮触发器 - javascript

javascript Accessible Dropdown + Utils

javascript 带DropDown的DataTable

javascript calendar_tag_dropdown.js

下拉菜单--JavaScript触发方法

javascript listas transformar valores dropdown filtro insertaFiltro insertaFiltros convertir convers