0

我想实施国家选择输入。换句话说,我有一个带有 25x25px 标志的表单,我希望它是可点击的 - 比如说,默认为德语,首先单击将其更改为荷兰,其次为瑞士或 w/e。

最后选择的值需要与表单的其他值一起在我的 POST-Array 中。

我尝试使用带有 javascript 的 3-Way 复选框来完成此操作,但我需要超过 3 个选项。

关于如何做到这一点的任何想法?我考虑过输入选择,隐藏除当前值之外的所有内容 - 但我不知道如何提交它以更改为下一个值。

提前感谢您的任何意见,请不要因为这样的问题评判我 - 这是我的第一个 js/html/css 项目。:-)

4

1 回答 1

2

你可以这样做:

HTML

<form method="POST">
    <img src="german.png" onclick="switchCountry(this);"/>
    <input id="country" name="country" type="hidden" value="german" />
    <input type="submit" value="Submit" />
</form>

JavaScript

var countries = ['german', 'netherlands', 'swiss'];

var switchCountry = function(img) {
    var input = document.getElementById('country'),
        oldValue = input.getAttribute('value'),
        newValue = countries[(countries.indexOf(oldValue) + 1) % countries.length];

    // Switch input value that will be posted with form 
    input.setAttribute('value', newValue);

    // Switch graphical representation of country
    img.setAttribute('src', newValue + '.png');
};

这里的例子http://jsbin.com/alasip/1/edit

于 2013-05-06T13:01:03.163 回答