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]);
    }

}

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

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

我将 jQuery 1.61.min.js 与 jQuery 表单 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's change function？它可能会为您处理一些浏览器的怪癖。

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

别忘了去掉 HTML 中 select 的 onchange 属性。

Answer 2

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