In order to access this site you need to enable JavaScript!

You are here: Reference > JavaScript > client-side > event handling > properties > srcFilter (event)

srcFilter property (event)

Browser support:

Specifies or retrieves a reference to the filter object that generated the onfilterchange event.

This property does not seem to work, always returns null. Use the srcElement event property and the filters collection instead.

Syntax:

object.srcFilter;

You can find the related objects in the Supported by objects section below.

This property is read/write.

Possible values:

Reference to the filter object that generated the onfilterchange event.

Default: this property has no default value.

Example HTML code 1:

This example illustrates the use of the srcFilter and srcElement properties and the filters collection:

<head>
    <style>
        #mySpan {
            position:absolute;
            left:150px;
            top:50px;
            filter:alpha (opacity=34);
            color:red;
            font-weight:bold;
        }
    </style>
    <script type="text/javascript">
        function ChangeFilter (select) {
            var selectedOption = select.options[select.selectedIndex];
            var span = document.getElementById ("mySpan");
            span.filters["alpha"].Opacity = selectedOption.text;
        }

        function OnFilterChanged () {
            if (event.srcFilter) {
                var changedFilter = event.srcFilter;
            }
            else {
                var changedFilter = event.srcElement.filters["alpha"];
            }
            
            var opac = document.getElementById ("opac");
            opac.innerHTML =  changedFilter.Opacity;
        }

    </script>
</head>
<body>
    <span id="mySpan" onfilterchange="OnFilterChanged (this)">Some text with opacity.</span>
    <br /><br />
    Current opacity: <span id="opac"></span>
    <br /><br />
    Change the opacity:
    <select onchange="ChangeFilter (this)">
        <option>0</option>
        <option>20</option>
        <option>40</option>
        <option>60</option>
        <option>80</option>
        <option>100</option>
    </select>
</body>