Internet Explorer 6 和 8 onchange 不工作

Question

我正在尝试使用选择框的 onchange 方法填充表单上的某些字段。

<tr>
                <td align="left"><label>*Select Branch:</label></td>
                <td><form:select tabindex="5" path="userInputBranch" onchange="setProcessorBranchLocationOnChange()">
                        <form:option value="--" label="--" />
                        <form:options items="${ customerAddEntity.selectionContentsBranch}" itemLabel="key" itemValue="value" />
                    </form:select> 
                    <form:hidden path="autoUserInputProcessor" /> 
                    <form:hidden path="autoUserInputCompany" /> 
                    <form:hidden path="autoUserInputLocation" />
                </td>
            </tr>

Javascript 函数：

function setProcessorBranchLocationOnChange() {
var rawBranch = $('#userInputBranch').attr('value').split('-');
    $('#autoUserInputProcessor').attr('value', rawBranch[0]);
    $('#autoUserInputCompany').attr('value', rawBranch[1]);
    $('#autoUserInputLocation').attr('value', rawBranch[2]);
    if(rawBranch[3]!=null){
        var cBranch = rawBranch[3].split('=');
        $('#userInputBranch').attr('value', cBranch[1]);
    }

}

如您所见，我正在尝试使用所选下拉值的子字符串值填充隐藏字段 autoUserInputProcessor、Company、Location。

这在 Chrome 和 IE7 中运行良好。我没有收到有关 IE6 和 IE8 中隐藏字段的任何更新。我正在使用 spring 的标签库来生成表单。任何帮助将不胜感激。如果您需要任何其他信息，请告诉我。

我正在使用 jQuery 1.61.min.js 以及 jQuery forms 2.4 和 jQuery UI 1.8。

以下是 Spring 生成的 select 的一些示例数据。

这是选项之一。 （我无法控制该值的格式，它是我收到的格式。）

    <option value="06-04-22-id=2504">Oneonta, NY</option>

这是填充字段的示例。

<input id="autoUserInputProcessor" name="autoUserInputProcessor" type="hidden" value="06">
<input id="autoUserInputCompany" name="autoUserInputCompany" type="hidden" value="04">
<input id="autoUserInputLocation" name="autoUserInputLocation" type="hidden" value="22">

这是我在页面加载时加载的完整 JavaScript 文件：

    //window.onbeforeunload = confirmExit;

    function setProcessorBranchLocationOnChange() {
    var rawBranch = $('#userInputBranch').attr('value').split('-');
    $('#autoUserInputProcessor').attr('value', rawBranch[0]);
    $('#autoUserInputCompany').attr('value', rawBranch[1]);
    $('#autoUserInputLocation').attr('value', rawBranch[2]);
    if(rawBranch[3]!=null){
        var cBranch = rawBranch[3].split('=');
        $('#userInputBranch').attr('value', cBranch[1]);
    }

    }

$(function() {
// Set tab indicies that aren't available until load.
$('#customersearchanchor').attr('tabIndex', 120);
$('#logoutLink').attr('tabIndex', 125);

// Set the processor, company, location
// hidden fields on branch select change

setProcessorBranchLocationOnChange();

});

Answer 1

尝试 jQuery 的更改功能？它可能会为您处理一些浏览器的怪异问题。

$('.selectorForTheSelect').change(setProcessorBranchLocationOnChange);

不要忘记删除 HTML 中 select 的 onchange 属性。

Answer 2

首先，userInputBranch不是元素的id
其次，使用 jQuery 的 .val() 函数，而不是 attr)'value');
由于您已经在使用 jquery，因此请使用 .change() 事件。