Is there an onSelect event or equivalent for HTML

2019-01-01 09:04发布

I have an input form that lets me select from multiple options, and do something when the user changes the selection. Eg,

<select onChange="javascript:doSomething();">
  <option>A</option>
  <option>B</option>
  <option>C</option>
</select>

Now, doSomething() only gets triggered when the selection changes.

I want to trigger doSomething() when the user selects any option, possibly the same one again.

I have tried using an "onClick" handler, but that gets triggered before the user starts the selection process.

So, is there a way to trigger a function on every select by the user?

Update:

The answer suggested by Darryl seemed to work, but it doesn't work consistently. Sometimes the event gets triggered as soon as user clicks the drop-down menu, even before the user has finished the selection process!

29条回答
梦寄多情
2楼-- · 2019-01-01 09:47

So my goal was to be able to select the same value multiple times which essentially overwrites the the onchange() function and turn it into a useful onclick() method.

Based on the suggestions above I came up with this which works for me.

<select name="ab" id="hi" onchange="if (typeof(this.selectedIndex) != undefined) {alert($('#hi').val()); this.blur();}" onfocus="this.selectedIndex = -1;">
    <option value="-1">--</option>
    <option value="1">option 1</option>
    <option value="2">option 2</option>
    <option value="3">option 3</option>
</select>

http://jsfiddle.net/dR9tH/19/

查看更多
人气声优
3楼-- · 2019-01-01 09:47

first of all u use onChange as an event handler and then use flag variable to make it do the function u want every time u make a change

<select

var list = document.getElementById("list");
var flag = true ; 
list.onchange = function () {
if(flag){
document.bgColor ="red";
flag = false;

}else{
document.bgColor ="green";
flag = true;
}
}
<select id="list"> 
<option>op1</option>
<option>op2</option>
<option>op3</option>
</select>

查看更多
后来的你喜欢了谁
4楼-- · 2019-01-01 09:49

What I did when faced with a similar Problem is I added an 'onFocus' to the select box which appends a new generic option ('select an option'or something similar) and default it as the selected option.

查看更多
流年柔荑漫光年
5楼-- · 2019-01-01 09:49

A long while ago now but in reply to the original question, would this help ? Just put onClick into the SELECT line. Then put what you want each OPTION to do in the OPTION lines. ie:

<SELECT name="your name" onClick>
<option value ="Kilometres" onClick="YourFunction()">Kilometres
-------
-------
</SELECT>
查看更多
还给你的自由
6楼-- · 2019-01-01 09:49

what about changing the value of the select when the element gains focus, e.g (with jquery):

$("#locationtype").focus(function() {
    $("#locationtype").val('');
});

$("#locationtype").change(function() {
    if($("#locationtype").val() == 1) {
        $(".bd #mapphp").addClass('show');
        $("#invoerform").addClass('hide');
    }
    if($("#locationtype").val() == 2) {
        $(".lat").val('');
        $(".lon").val('');
    }
});
查看更多
登录 后发表回答