mirror of
https://github.com/tuxis-ie/nsedit.git
synced 2025-04-20 20:13:40 +03:00
93 lines
1.9 KiB
Markdown
93 lines
1.9 KiB
Markdown
**Author:** Stephen Korecky <br>
|
|
**Website:** http://stephenkorecky.com <br>
|
|
**Plugin Website:** https://github.com/skorecky/Add-Clear <br>
|
|
**NPM jQuery Plugin:** https://www.npmjs.com/package/add-clear <br>
|
|
_jQuery Plugin website is outdated and read-only now. Please use NPM_<br>
|
|
**jQuery Plugin:** http://plugins.jquery.com/add-clear/
|
|
|
|
## About
|
|
|
|
Add Clear is a jQuery plugin that adds a input clearing button on any input you
|
|
apply it to. It clears the value, and returns focus to that field.
|
|
|
|
## How to use
|
|
|
|
- Load jQuery into your project
|
|
- Load Add Clear plugin into your project
|
|
- Setup which elements you would like to apply this plugin to.
|
|
|
|
### Usage
|
|
```javascript
|
|
$(function(){
|
|
$("input").addClear();
|
|
});
|
|
|
|
// Example onClear option usage
|
|
$("input").addClear({
|
|
onClear: function(){
|
|
alert("call back!");
|
|
}
|
|
});
|
|
```
|
|
### Available Options
|
|
|
|
<table>
|
|
<tr>
|
|
<th>Option</th>
|
|
<th>Default</th>
|
|
<th>Type</th>
|
|
</tr>
|
|
<tr>
|
|
<td>closeSymbol</td>
|
|
<td>✖</td>
|
|
<td>string</td>
|
|
</tr>
|
|
<tr>
|
|
<td>top</td>
|
|
<td>1</td>
|
|
<td>number</td>
|
|
</tr>
|
|
<tr>
|
|
<td>right</td>
|
|
<td>4</td>
|
|
<td>number</td>
|
|
</tr>
|
|
<tr>
|
|
<td>returnFocus</td>
|
|
<td>true</td>
|
|
<td>boolean</td>
|
|
</tr>
|
|
<tr>
|
|
<td>showOnLoad</td>
|
|
<td>false</td>
|
|
<td>boolean</td>
|
|
</tr>
|
|
<tr>
|
|
<td>hideOnBlur</td>
|
|
<td>false</td>
|
|
<td>boolean</td>
|
|
</tr>
|
|
<tr>
|
|
<td>tabbable</td>
|
|
<td>true</td>
|
|
<td>boolean</td>
|
|
</tr>
|
|
<tr>
|
|
<td>onClear</td>
|
|
<td>null</td>
|
|
<td>function</td>
|
|
</tr>
|
|
<tr>
|
|
<td>paddingRight</td>
|
|
<td>20px</td>
|
|
<td>string</td>
|
|
</tr>
|
|
</table>
|
|
|
|
### Note about Microsoft Browsers
|
|
|
|
The more modern Microsoft browsers (IE10+ and Edge) have built-in clear buttons that appear
|
|
automatically on text inputs. To prevent those buttons from interfering with Add Clear, you must
|
|
use the `::-ms-clear` CSS pseudo-element in your styles, as described here:
|
|
|
|
https://developer.mozilla.org/en-US/docs/Web/CSS/::-ms-clear
|