芝麻web文件管理V1.00
编辑当前文件:/home/mgatv524/public_html/midiatech/vendor/emojione/emojione/demos/convert-on-submit.html
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Convert on Form Submission - Emoji One Labs</title> <!-- Emoji One CSS: --> <link rel="stylesheet" href="./../assets/css/emojione.min.css" type="text/css" media="all" /> <!-- jQuery: --> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> <!-- Demos Stylesheet: --> <link rel="stylesheet" href="styles/demos.css"/> <!-- Typekit: --> <script type="text/javascript" src="//use.typekit.net/ivu8ilu.js"></script> <script type="text/javascript">try{Typekit.load();}catch(e){}</script> <!-- Syntax Highlighting --> <script type="text/javascript" src="scripts/shCore.js"></script> <script type="text/javascript" src="scripts/shBrushJScript.js"></script> <script type="text/javascript" src="scripts/shBrushCss.js"></script> <script type="text/javascript" src="scripts/shBrushPhp.js"></script> <script type="text/javascript">SyntaxHighlighter.all();</script> <link rel="stylesheet" href="styles/shCoreRDark.css"/> <!-- Emoji One JS --> <script src="./../lib/js/emojione.js"></script> <script type="text/javascript"> // ################################################# // # Optional // default is PNG but you may also use SVG emojione.imageType = 'svg'; // default is ignore ASCII smileys like :) but you can easily turn them on emojione.ascii = true; // if you want to host the images somewhere else // you can easily change the default paths emojione.imagePathPNG = './../assets/png/'; emojione.imagePathSVG = './../assets/svg/'; // ################################################# </script> </head> <body> <!-- Masthead --> <header class="masthead"> <div class="container"> <h1 class="masthead-title">Emoji One Labs</h1><span class="version">version <span>1.5.1</span></span> </div> </header> <!-- Breadcrum Navigation --> <nav class="breadcrumbs"> <div class="container"> <a class="breadcrumb-item top-level" href="index.html">All Demos</a> › <a href="index.html#extras">Extras</a> › <a class="breadcrumb-item active" href="convert-on-submit.html">Convert on Form Submission</a> </div> </nav> <!-- Page: --> <main> <div class="container"> <h1>Convert on Form Submission</h1> <p>This demo shows how you can use jQuery to automatically convert native unicode emoji to their shortnames upon form submission.</p> <h3>Input:</h3> <form id="myForm" name="myForm"> <input type="text" id="myInput" name="myInput" style="width: auto" size="50" value="Hello world! 😄"/> <input type="submit" value="Submit" style="float: none"/> </form> <script type="text/javascript"> $(document).ready(function() { $("#myForm").on('submit',function(e) { var input = $('#myInput').val(); var replaced = emojione.toShort(input); $('#myInput').val(replaced); // prevent form submission // normally you wouldn't do this but we don't want your page to reload for this demo e.preventDefault(); }); }); </script> <h3>Required extras</h3> <p> To get this example working correctly we needed to include a few extra pieces, including: </p> <ul> <li><a href="http://jquery.com/">jQuery</a></li> <li>Custom JS (see below)</li> </ul> <h3>jQuery Snippet:</h3> <pre class="brush: js"> <script type="text/javascript"> $("#myForm").on('submit',function(e) { var input = $('#myInput').val(); var replaced = emojione.toShort(input); $('#myInput').val(replaced); // prevent form submission // normally you wouldn't do this but we don't want your page to reload for this demo e.preventDefault(); }); </script> </pre> </div> </main> <footer class="demo-footer"> <div class="container"> <small>© Copyright 2014-2015 Ranks.com.</small> <small>Emoji One artwork is licensed under the <a href="https://creativecommons.org/licenses/by/4.0/legalcode">CC-BY-SA-4.0</a> License</small> <small>Emoji One demos, documentation, scripts, stylesheets and all other non-artwork is licensed under the <a href="http://opensource.org/licenses/MIT">MIT</a> License</small> </div> </footer> </body> </html>