Question

我有一个Web应用程序，该应用程序具有一个onchange事件，用于将多个选择选项加载到以'，'分隔的文本框中，并切片最后一个'，' 一切正常我还有另一个填写表格的功能。当我尝试加载表单时，仅select选项正在更新，期望onchange函数从select中获取数据并在文本框中具有某些值。但是遗憾的是，它不起作用，但是只有在选择或删除并重新添加了新选项之后才起作用

通过onchange事件将多个选择数据添加到文本框的功能：

// arguments: reference to select list, callback function (optional)
function getSelectedOptions(sel,fn) {
    var opts = [], opt;
    // loop through options in select list
    for (var i=0, len=sel.options.length; i<len; i++) {
        opt = sel.options[i];
        // check if selected
        if ( opt.selected ) {
            // add to array of option elements to return from this function
            opts.push(opt);
            // invoke optional callback function if provided
            if (fn) {
              fn(opt);
            }}}
    // return array containing references to selected option elements
    return opts;
}

// example callback function (selected options passed one by one)
function callback(opt) {
    // display in textarea for this example
    var display = document.getElementById('display');
    display.innerHTML += opt.value + ',';
}

// anonymous function onchange for select list with id lstBox2
document.getElementById('sel1').onchange = function(e) {
    // get reference to display textareaa
    var display = document.getElementById('display');
    display.innerHTML = ''; // reset
    // callback fn handles selected options
    getSelectedOptions(this, callback);
    // remove ', ' at end of string
    var str = display.innerHTML.slice(0, -1);
    display.innerHTML = str;
};

表单填写功能：

$(document).ready(function () {
               tests = split[testIndex];
              // $('#display2').val(tests);
               var opt2 = '<option selected>' + tests + '</option>';
               $('#sel').append(opt2);})

Answer 1

尝试将document.getElementById（'sel1'）。onchange代码移至$（document）.ready（...）块中。没有完整的页面示例很难说，但是一种可能是，当您尝试添加onchange处理程序时，“ sel1”还不是DOM的一部分。

Answer 2

尝试使用

MessageProperties

而不是如果元素是在加载后添加的。

onchange事件在页面加载开始时不起作用

2 个答案: