Skip to main content
CSS-Tricks
  • Articles
  • Videos
  • Almanac
  • Newsletter
  • Guides
  • DigitalOcean
  • DO Community
Search
Code Snippets → jQuery Code Snippets → Keep Text Inputs in Sync

Keep Text Inputs in Sync

Avatar of Chris Coyier
Chris Coyier on Oct 2, 2010
var $inputs = $(".example-input");
$inputs.keyup(function() {
      $inputs.val($(this).val());
});

Example



Psst! Create a DigitalOcean account and get $200 in free credit for cloud-based hosting and services.

Comments

  1. black-light-studio
    Permalink to comment# April 21, 2011

    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

    Reply
  2. Roman Gavrilov
    Permalink to comment# October 7, 2011

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

    Reply
    • Ricky
      Permalink to comment# January 3, 2014

      For folks using jquery 1.7+

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

    not working in ie

    Reply

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

CSS-Tricks is powered by DigitalOcean.

Keep up to date on web dev

with our hand-crafted newsletter

DigitalOcean
  • DigitalOcean
  • DigitalOcean Community
  • About DigitalOcean
  • Legal
  • Free Credit Offer
CSS-Tricks
  • Email
  • Guest Writing
  • Book
  • Advertising
Follow
  • Mastodon
  • Twitter
  • Instagram
  • YouTube
  • CodePen
  • iTunes
  • RSS
Back to Top