javascript - jQuery val() comparison - Stack Overflow

admin管理员组

文章数量:1400124

I am trying to pare the values of two input fields with jQuery. However, it does seem correct but it doesn't alert when one of the values is larger.

Enter the key:
<input type="text" name="key" size="35" id="q17" autoplete="off">
<input id="charsLeft" type="text" class="count1" disabled>

<br /><br />

Plaintext:
<input type="text" name="key" size="35" id="q18" autoplete="off">
<input id="charsLeft2" autocapitalize="off" autocorrect="off" type="text" class="count" disabled>

JavaScript:

$(document).ready(function() {
  // Count key
  $("#q17").keyup(function() {
      $('#charsLeft').val($(this).val().length);
  });
  // Count plaintext
  $("#q18").keyup(function() {
      $('#charsLeft2').val($(this).val().length);
  });
  // Compare key|plaintext
  if ($('#charsLeft').val() < $('#charsLeft2').val()) {
    alert('Key is shorter than the plaintext');
  }
});

I am trying to pare the values of the two input fields (charsLeft and charsLeft2). What am I missing here? Here is a fiddle: /

I am trying to pare the values of two input fields with jQuery. However, it does seem correct but it doesn't alert when one of the values is larger.

Enter the key:
<input type="text" name="key" size="35" id="q17" autoplete="off">
<input id="charsLeft" type="text" class="count1" disabled>

<br /><br />

Plaintext:
<input type="text" name="key" size="35" id="q18" autoplete="off">
<input id="charsLeft2" autocapitalize="off" autocorrect="off" type="text" class="count" disabled>

JavaScript:

$(document).ready(function() {
  // Count key
  $("#q17").keyup(function() {
      $('#charsLeft').val($(this).val().length);
  });
  // Count plaintext
  $("#q18").keyup(function() {
      $('#charsLeft2').val($(this).val().length);
  });
  // Compare key|plaintext
  if ($('#charsLeft').val() < $('#charsLeft2').val()) {
    alert('Key is shorter than the plaintext');
  }
});

I am trying to pare the values of the two input fields (charsLeft and charsLeft2). What am I missing here? Here is a fiddle: http://jsfiddle/2mgzn4pL/

• javascript
• jquery
• html

Share Improve this question Follow asked Oct 10, 2015 at 16:06 McJohnsonMcJohnson 31311 silver badge1111 bronze badges 1

• just use +$('#charsLeft').val() < +$('#charsLeft2').val() – Sherali Turdiyev Commented Oct 10, 2015 at 16:11

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 6

You're paring strings, not integers. You can use parseInt() to convert them. Try this:

if (parseInt($('#charsLeft').val(), 10) < parseInt($('#charsLeft2').val(), 10)) {
    alert('Key is shorter than the plaintext');
}

Updated fiddle

.val() returns a string. You should use parseInt or parseFloat.

There a two problems with your code:

1. You're paring string values with .val() not string lengths
2. Your parison code is executed on page load - which means only when the page has loaded you'll see the result, but on this event the result is false and nothing is being alerted.

For the first problem you should pare string lengths this way $('#charsLeft').val().length < $('#charsLeft2').val().length.

For the second problem you should put your parison code in a button's click event handler function or something in this sort. Another option is to use the focusout event of the second input and attach an event handler with .focusout().

本文标签： javascriptjQuery val() comparisonStack Overflow