JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
<div class="container">
     <h1>iOS7 trim test</h1>
    <p>Enter some text into the input field and then blur to see the different trim approaches</p>
    <form role="form">
        <div class="form-group">
            <label for="test0">Enter text</label>
            <input type="text" class="form-control" id="test0">
        </div>
        <div class="form-group">
            <label>No trim</label> <pre id="test0Value"></pre>

        </div>
        <div class="form-group">
            <label>Prototype trim</label> <pre id="test1Value"></pre>

        </div>
        <div class="form-group">
            <label>Dojo trim</label> <pre id="test2Value"></pre>

        </div>
        <div class="form-group">
            <label>Regex v1 trim</label> <pre id="test3Value"></pre>

        </div>
        <div class="form-group">
            <label>Regex v2 trim</label> <pre id="test4Value"></pre>

        </div>

JavaScript

require([
    'dojo/_base/lang',
    'dojo/dom',
    'dojo/on',
    'dojo/domReady!'],

function (
lang,
dom,
on) {
    on(dom.byId('test0'), 'blur', function (e) {
        var input = e.target;
        dom.byId('test0Value').innerHTML = input.value;
        dom.byId('test1Value').innerHTML = input.value.trim();
        dom.byId('test2Value').innerHTML = lang.trim(input.value);
        dom.byId('test3Value').innerHTML = input.value.replace(/(?:(?:^|\n)\s+|\s+(?:$|\n))/g, '').replace(/\s+/g, ' ');
        dom.byId('test4Value').innerHTML = input.value.replace(/^\s+|\s+$/g, "");
    });
});