javascript - 如何将下拉列表中的数据连接到javascript中输入文本的数据

Question

假设我在使用表单时遇到此问题

<form name = "card">
    Your Card's Number: <input type="text" placeholder="XXXX XXXX XXXX XXXX" onfocus="this.placeholder = ''" onblur="this.placeholder = 'XXXX XXXX XXXX XXXX'" id = "card_num"/></br>
</form>     

    Type of Credit Card:
    <select id = "typeCard">
    <option value="none" selected="selected">-- choose one --</option>
    <option>Visa</option>
    <option>Master</option>
    <option>JCB</option>
    </select>
    <input type = "button" value = "Validate" onclick = "validateCard()">

这是我的 html 代码，我想获取信用卡号码的值，以便使用 JavaScript 进行验证

    function validateCard()
{

    var card = document.getElementById("typeCard").value;
    var cardNum = document.getElementById("card_num").value;
    document.write(cardNum);    

    if (card === "Visa")
    {
        alert("hey");
    }

    else if (card ==="Master")
    {
        alert("hoy");
    }

    else if (card ==="JBC")
    {
        alert("hoy");
    }
}

这是我的 javascript 代码，它不适用于

var cardNum = document.getElementById("card_num").value;
    document.write(cardNum);    

代码，任何人都可以帮助我，我已经用谷歌搜索了它，但我找不到任何解决方案。

Answer 1

你的脚本来自哪里？在您绑定(bind)单击事件处理程序时，它可能尚未加载。所以你最好使用

document.getElementById('validateBtn').addEventListener('click', validateCard, null);

在代码中。也不要使用 document.write。我创建了工作demo .