title: jQuery remove duplicated hashtag
body: <p>I'm trying to make a hashtag system using jQuery, but I have a problem with my code. So normally the code is working fine. But I want to remove duplicated tags in the written hashtags.</p>
  
  <p>I've created this <strong><a href="http://codepen.io/shadowman86/pen/EmaejY" rel="nofollow noreferrer">DEMO</a></strong> on codepen.io</p>
  
  <p>In this demo when you write something and press space then the <code>#</code> is automatically added in front of the word. I do not want users to be able to write the same word twice like: <code>#abc #Abc #aBc #abC #ABC</code>  </p>
  
  <p>I have created this code using regex but it didn't work.</p>
  
  <pre><code>// Remove duplicated hashatgs.
    text = text.replace(/[#]{2,}/gi, function removeHashtags(x) { return '#'; });
  </code></pre>
  
  <p>Here is full code:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>// Move cursor to the end.
  function placeCaretAtEnd(el) {
      el.focus();
      if (typeof window.getSelection != "undefined"
              &amp;&amp; typeof document.createRange != "undefined") {
          var range = document.createRange();
          range.selectNodeContents(el);
          range.collapse(false);
          var sel = window.getSelection();
          sel.removeAllRanges();
          sel.addRange(range);
      } else if (typeof document.body.createTextRange != "undefined") {
          var textRange = document.body.createTextRange();
          textRange.moveToElementText(el);
          textRange.collapse(false);
          textRange.select();
      }
  }
  
  
  // Add hashtags on each word.
  function addHashtags(text) {
    // Add hashtag.
    text = text.replace(/([\w]+)/gi, function addHashtag(x){ return '#' + x; });
    // Remove duplicated hashatgs.
    text = text.replace(/[#]{2,}/gi, function removeHashtags(x) { return '#'; });
    // Prevent double spaces  
    text = text.replace(/  /g, ' ');
     
    text = text.trim();
    // return results
    return text;
  }
  
  
  // Convert characters to charCode
  function toCharCode(char) { return char.charCodeAt(0); }
  
  
  // Define special characters:
  var characters = new Set([
    0, 32, // space
    13, // enter
    // add other punctuation symbols or keys
  ]);
  
  
  var forbiddenCharacters = new Set([
    toCharCode("_"),
    toCharCode("-"),
    toCharCode("?"),
    toCharCode("*"),
    toCharCode("\\"),
    toCharCode("/"),
    toCharCode("("),
    toCharCode(")"),
    toCharCode("="),
    toCharCode("&amp;"),
    toCharCode("%"),
    toCharCode("+"),
    toCharCode("^"),
    toCharCode("#"),
    toCharCode("'"),
    toCharCode("&lt;"),
    toCharCode("|"),
    toCharCode("&gt;"),
    toCharCode("."),
    toCharCode(","),
    toCharCode(";")
  ]);
  
  
  
  $(document).ready(function() {
    var element = '#text';
  
    $(element).keypress(function (e) {
      if (characters.has(e.keyCode)) {
        // Get and modify text.
        var text = $(element).text();
        text = addHashtags(text);
        // Save content.
        $(element).text(text);
        // Move cursor to the end
        placeCaretAtEnd(document.querySelector(element));
      } else if (forbiddenCharacters.has(e.keyCode)) {
        e.preventDefault();
      }
    });
  });</code></pre>
  <pre class="snippet-code-css lang-css prettyprint-override"><code>.container {
     position:relative;
     width:100%;
     max-width:600px;
     overflow:hidden;
     padding:10px;
     margin:0px auto;
     margin-top:50px;
  }
  * {
     box-sizing:border-box;
     -webkit-box-sizing:border-box;
     -moz-box-sizing:border-box;
  }
  .addiez {
     position:relative;
     width:100%;
     padding:30px;
     border:1px solid #d8dbdf;
     outline:none;
     font-family: helvetica, arial, sans-serif;
     -moz-osx-font-smoothing: grayscale;
     -webkit-font-smoothing: antialiased;
  }
  .addiez::-webkit-input-placeholder {
     /* Chrome/Opera/Safari */
     color: rgb(0, 0, 1);
  }
  .addiez[contentEditable=true]:empty:not(:focus):before  {
        content:attr(placeholder);
        color: #444;
      }
  
  .note {
     position:relative;
     width:100%;
     padding:30px;
     font-weight:300;
     font-family: helvetica, arial, sans-serif;
     -moz-osx-font-smoothing: grayscale;
     -webkit-font-smoothing: antialiased;
     line-height:1.8rem;
     font-size:13px;
  }
  .ad_text {
     position:relative;
     width:100%;
     padding:10px 30px;
     overflow:hidden;
     font-weight:300;
     font-family: helvetica, arial, sans-serif;
     -moz-osx-font-smoothing: grayscale;
     -webkit-font-smoothing: antialiased;
     line-height:1.8rem;
     font-size:13px;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;div class="container"&gt;
     &lt;div class="addiez" contenteditable="true" id="text" placeholder="Write something with space"&gt;&lt;/div&gt;
     &lt;div class="ad_text" id="ad_text"&gt;&lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>