All geek questions in one place

Disable or ignore mousedown in select field in firefox

Is there a way to make sure that clicking on the selection input field does not open the parameter list?

I tried to return false from onmousedown and onclick, I tried calling this.blur () in onfocus, I tried setting the readonly attribute, none of this works in Firefox. Chrome and IE seem to take the " return false" in the mousedown handler more seriously.

EDIT . What I want to do is implement my own interface for selecting an option from select input. Disabling sampling changes the look and prevents the triggering of any events in the control. Limiting one option still makes this option open when the user clicks on the control, so this is not a good solution.

I think I will have to delete selectand try to create something similar to it from the text box and image.

Code (online here ):

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <title>Test searchable select</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
    <script type="text/javascript">
        $(function() {
            $("#mys").mousedown(function () {
                console.log("mousedown");
                return false;
            }).focus(function() {
                console.log("focus");
                this.blur();
            });
        });
    </script>
<body>
<select style="width: 300px" id="mys" readonly="readonly">
    <option>apple</option>
    <option>banana</option>
</select>

</body>
</html>
+3
source share
2 answers

Why not do it disabled?

<select style="width: 300px" id="mys" readonly="readonly" disabled="disabled">
    <!-- ... -->
</select>
+1
source 
<script type="text/javascript">
        $(function() {
            $("#mys").mousedown(function () {
                $(this).val('1');//will close opened list
            })
        });
    </script>

<select style="width: 300px" id="mys" readonly="readonly">
    <option value='1'>apple</option>
</select>
0
source

Source: https://habr.com/ru/post/1715803/

More articles:


All Articles