The Lodge is members-only design/dev videos and Office Hours.

Next Office Hours Session: "Implementing an SVG Icon System" Nov 30 - 6:00 PM Eastern

Keep Text Inputs in Sync

Last updated on:
var $inputs = $(".example-input");
$inputs.keyup(function() {



  1. black-light-studio
    Permalink to comment#

    There seems to be some user unfriendly differences between firefox and chrome (that is that I have noticed)

    in firefox it works fine I think
    but in chrome your marker thing (that blinking line that tells you where in the field you are typing)
    will jump to the end of the field every time you release the key on your keyboard

    this makes it a pain in the ass to edit more than one character thats typed early in the field

  2. Roman Gavrilov
    Permalink to comment#

    doesn’t work when text is pasted using mouse (right click, paste)
    doesn’t work if value is pasted with javascript

    • Ricky
      Permalink to comment#

      For folks using jquery 1.7+

      $inputs.on( "paste keyup", function() { 
           $inputs.val( $( this ).val() );
  3. adarsh
    Permalink to comment#

    not working in ie

Leave a Comment

Posting Code

We highly encourage you to post problematic HTML/CSS/JavaScript over on CodePen and include the link in your post. It's much easier to see, understand, and help with when you do that.

Markdown is supported, so you can write inline code like `<div>this</div>` or multiline blocks of code in in triple backtick fences like this:

  function example() {
    element.innerHTML = "<div>code</div>";

There's a whole bunch of content on CSS-Tricks.

Search for Stuff   •   Browse the Archives

Get the Newsletter ... or get the RSS feed