Question

我如何获得期权价值。我想根据所选的选项值更改name="<value>"。这样我就可以将名称值与onChange=""一起发送给spring控制器。

我想根据选项选择值更改select name="report/leavereport/weeklysummery"。

 <select  name="" onChange="document.getReportAll.submit()">
        <option  value="">Select Report Type</option>
        <option  value="report">TIME REPORT</option>
        <option  value="leavereport">LEAVE REPORT</option>
        <option  value="weeklysummery">TIME SUMMARY</option>
 </select>

谢谢，

Answer 1

鉴于代码和现代浏览器，最短的变化是：

onChange="this.name = this.value; document.getReportAll.submit()"

...因为在属性事件处理程序中，this引用了select元素，而现代浏览器在单选中将选项值反映为value。

Answer 2

将ID设置为select。

<select id="select"...>...</select>

然后设置onchange元素的select事件。选择一个选项时会触发。

如果选择器value未定义，则浏览器不支持它，因此可以让所选元素迭代选项并检查是否包含属性selected。我不使用querySelector，因为较旧的浏览器可能不支持它。

var selector = document.getElementById('select');

selector.onchange = function() {

    var value = this.value;

    if(!value) {

        for(var i = 0, op; op = selector.children[i]; i ++) {
            // Check if the attribute selected is valid
            if(op.getAttribute('selected')) {
                value = op.value;
                break;
            }
        }

    }

    this.name = value;

};

Answer 3

以下是使用getAttribute和setAttribute的一种可能（不引人注意的）解决方案。

脚本会侦听options中任何一个的点击，然后根据name属性的值更新select value属性的值option。

var options = document.getElementsByTagName('option');

function changeName() {
var value = this.getAttribute('value');
window.alert('name = "' + value + '"');
this.parentNode.setAttribute('name',value);
}

for (var i = 0; i < options.length; i++) {
options[i].addEventListener('click',changeName,false);
}

<select  name="">
<option  value="">Select Report Type</option>
<option  value="report">TIME REPORT</option>
<option  value="leavereport">LEAVE REPORT</option>
<option  value="weeklysummary">TIME SUMMARY</option>
</select>

如何根据选项值更改HTML选择名称

3 个答案: