Question

我正在尝试使用javascript onchange方法我是编码新手。我选择ID时想要的内容键入要更改为护照的输入文本，当我选择南非ID时，输入要更改为南非ID，这是一个代码。护照字段隐藏一旦我选择密码，南非身份证必须在护照中更改

 <div class="editor-label"><label for="IDType">ID Type:</label></div>
    <div class="editor-field"><select class="editor-dropdown" id="IdType" name="IDType">
    <option value="SouthAfricanId">South African ID</option>
    <option value="Passport">Passport</option>
    <input id="Passport" name="Passport" type="hidden" value="True">           
    </div>
    <div class="editor-label">
    <label id="lbIDValue">South African ID:</label>
    </div>
    <div class="editor-field">
    <input class="textbox" id="txIdValue" maxlength="13" name="IDValue" type="text" value="">
    </div>

Answer 1

你可以尝试下面的JQuery：

$("#IdType").change(function(){
    $("#lbIDValue").val($(this).find("option:selected").text());
    if($(this).val() == "passport"){
        $('#Passport').hide();
    }
    else{
        $('#Passport').show();
    }
})

Answer 2

如果您不使用jQuery，则可以使用纯JavaScript来实现所需的结果。将更改事件附加到select元素，然后使用event.target.value找出选择的选项。

var select = document.getElementById('IdType');
var options = select.getElementsByTagName('option');
var label = document.getElementById('lbIDValue');

function selectChanged(e) {
   var value = e.target.value;
   var option;

    for (var i = 0; i < options.length; i++) {
        if (options[i].value === value) {
            option = options[i];   
        }
    }

    label.innerText = option.innerText;
}

select.addEventListener('change', selectChanged, false);

参见jsFiddle - http://jsfiddle.net/60dsnhrt/

html也是无效的 - 它应该有一个结束选择

Javascript onchange下拉助手

2 个答案: