DBS DBS - 4 months ago 17
HTML Question

Allow more than 524288 characters in a WebKit text input

Is there any way to increase Chromes default 524288 character limit for text input elements? (Seems to also occur in Safari, so I'm assuming it's WebKit related)

For context, I'm using this input to hold a base64 encoded image. Unfortunately I need to use an input element due to the situation, so just using a hidden element isn't an option.

To demonstrate, in WebKit browsers these number will not match, every other browser doesn't seem to limit the input. Is there a way to work around this?



$(document).ready(function(){
// Build a really long string
var reallyLongString = "abcdefghijklmnopqrstuvwxyz";
for(var i = 0; i < 15; i++){
reallyLongString = reallyLongString + reallyLongString;
}

// The important bit
$("#inputElement").val(reallyLongString);
$("#quantityDisplay").html(
"Actual length: " + reallyLongString.length +
"<br />" +
"Input length: " + $("#inputElement").val().length
);
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="inputElement" type="text" />
<div id="quantityDisplay"></div>




DBS DBS
Answer

It appears this restriction doesn't apply to the textarea element, which can be substituted in and will work correctly.

$(document).ready(function(){
  // Build a really long string
  var reallyLongString = "abcdefghijklmnopqrstuvwxyz";
  for(var i = 0; i < 15; i++){
   reallyLongString = reallyLongString + reallyLongString;
  }

  // The important bit
  $("#inputElement").val(reallyLongString);
  $("#quantityDisplay").html(
    "Actual length: " + reallyLongString.length + 
    "<br />" +
    "Input length: " + $("#inputElement").val().length
  );
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<textarea id="inputElement" type="text"></textarea>
<div id="quantityDisplay"></div>