jquery - Group multiple or statements within an IF in javascript - Stack Overflow

admin管理员组

文章数量:1025227

The following code works:

$(".valClear").each(function () {
        if ($(this).val().indexOf(".png") == -1) {
            $(this).val('');
        }
    });

However this doesn't (the value is removed even if it contains .png or .jpeg), what am I doing wrong?

$(".valClear").each(function () {
        if (($(this).val().indexOf(".png") == -1) || ($(this).val().indexOf(".jpeg") == -1)) {
            $(this).val('');
        }
    });

The following code works:

$(".valClear").each(function () {
        if ($(this).val().indexOf(".png") == -1) {
            $(this).val('');
        }
    });

However this doesn't (the value is removed even if it contains .png or .jpeg), what am I doing wrong?

$(".valClear").each(function () {
        if (($(this).val().indexOf(".png") == -1) || ($(this).val().indexOf(".jpeg") == -1)) {
            $(this).val('');
        }
    });

• javascript
• jquery

Share Improve this question Follow asked Dec 25, 2010 at 23:41 The Muffin ManThe Muffin Man 20k3030 gold badges126126 silver badges196196 bronze badges 4

• What is the purpose of that code? :) – Heikki Commented Dec 25, 2010 at 23:46
• @Heikki, looping over 10 fileuploads to see if they contain .png, .jpeg, .bmp. If they don't remove the current file. – The Muffin Man Commented Dec 25, 2010 at 23:51
• @Dykam, this is enforced server side also, so no its not "So vulnerable in any way." – The Muffin Man Commented Dec 26, 2010 at 2:25
• Ah, okay. Just warned. It's a mon trap. – Dykam Commented Dec 26, 2010 at 10:03

Add a ment  | 

4 Answers 4

Sorted by: Reset to default 3

You're doing an OR, seems like you want an AND, like this:

$(".valClear").each(function () {
    if (($(this).val().indexOf(".png") == -1) && ($(this).val().indexOf(".jpeg") == -1)) {
        $(this).val('');
    }
});

With your OR logic, the value will likely not have either one of them, and the other part will be true, you want an AND, meaning it has neither in the value.

You can also optimize it a bit, like this:

$(".valClear").each(function () {
  var val = $(this).val();
  if ((val.indexOf(".png") == -1) && (val.indexOf(".jpeg") == -1)) {
    $(this).val('');
  }
});

---

To stray quite a bit from the question, and towards your actual problem...I'd actually change up how you're doing this, using an array of allowed extensions and $.inArray() to check it, like this:

var allowedExtensions = ["png", "jpeg", "bmp"];
$(".valClear").each(function () {
  if ($.inArray($(this).val().split('.').pop(), allowedExtensions) == -1) {
    $(this).val('');
  }
});

You can test it here. You can see from the format, this is much easier to expand to allow additional extensions later.

You have to use AND:

($(this).val().indexOf(".png") == -1) && ($(this).val().indexOf(".jpeg") == -1)

If the the string ends in .jpeg then the first expression will evaluate to true.
true OR false == true (the second expression won't even get evaluated).

Another option is to negate the whole expression (and test for whether .png and .jpeg are contained rather than not contained):

!($(this).val().indexOf(".png") > -1) || ($(this).val().indexOf(".jpeg") > -1))

Think of that second if test. It's like saying this:

If what you offer me for dinner is not roast chicken or it is not cold ham, then I'll have some

In that situation, you might get some cold ham or you might get roast chicken. Why? Because roast chicken is not cold ham, and because cold ham is not roast chicken. You said you're OK with whatever the kitchen has ready as long as what you get is either not roast chicken or not cold ham, so either of the two satisfies the condition.

If you phrase the qualifier with and instead of or, of course, then the kitchen will have to get creative with the left-over mashed potatoes.

Here's an alternative for and/or conditions. If the value doesn't match the regexp then..

$(".valClear").each(function () {
  if ( !$(this).val().match(/\.(png|jpeg)/) ) {
    $(this).val('');
  }
});

The following code works:

$(".valClear").each(function () {
        if ($(this).val().indexOf(".png") == -1) {
            $(this).val('');
        }
    });

However this doesn't (the value is removed even if it contains .png or .jpeg), what am I doing wrong?

$(".valClear").each(function () {
        if (($(this).val().indexOf(".png") == -1) || ($(this).val().indexOf(".jpeg") == -1)) {
            $(this).val('');
        }
    });

The following code works:

$(".valClear").each(function () {
        if ($(this).val().indexOf(".png") == -1) {
            $(this).val('');
        }
    });

However this doesn't (the value is removed even if it contains .png or .jpeg), what am I doing wrong?

$(".valClear").each(function () {
        if (($(this).val().indexOf(".png") == -1) || ($(this).val().indexOf(".jpeg") == -1)) {
            $(this).val('');
        }
    });

• javascript
• jquery

Share Improve this question Follow asked Dec 25, 2010 at 23:41 The Muffin ManThe Muffin Man 20k3030 gold badges126126 silver badges196196 bronze badges 4

• What is the purpose of that code? :) – Heikki Commented Dec 25, 2010 at 23:46
• @Heikki, looping over 10 fileuploads to see if they contain .png, .jpeg, .bmp. If they don't remove the current file. – The Muffin Man Commented Dec 25, 2010 at 23:51
• @Dykam, this is enforced server side also, so no its not "So vulnerable in any way." – The Muffin Man Commented Dec 26, 2010 at 2:25
• Ah, okay. Just warned. It's a mon trap. – Dykam Commented Dec 26, 2010 at 10:03

Add a ment  | 

4 Answers 4

Sorted by: Reset to default 3

You're doing an OR, seems like you want an AND, like this:

$(".valClear").each(function () {
    if (($(this).val().indexOf(".png") == -1) && ($(this).val().indexOf(".jpeg") == -1)) {
        $(this).val('');
    }
});

With your OR logic, the value will likely not have either one of them, and the other part will be true, you want an AND, meaning it has neither in the value.

You can also optimize it a bit, like this:

$(".valClear").each(function () {
  var val = $(this).val();
  if ((val.indexOf(".png") == -1) && (val.indexOf(".jpeg") == -1)) {
    $(this).val('');
  }
});

---

To stray quite a bit from the question, and towards your actual problem...I'd actually change up how you're doing this, using an array of allowed extensions and $.inArray() to check it, like this:

var allowedExtensions = ["png", "jpeg", "bmp"];
$(".valClear").each(function () {
  if ($.inArray($(this).val().split('.').pop(), allowedExtensions) == -1) {
    $(this).val('');
  }
});

You can test it here. You can see from the format, this is much easier to expand to allow additional extensions later.

You have to use AND:

($(this).val().indexOf(".png") == -1) && ($(this).val().indexOf(".jpeg") == -1)

If the the string ends in .jpeg then the first expression will evaluate to true.
true OR false == true (the second expression won't even get evaluated).

Another option is to negate the whole expression (and test for whether .png and .jpeg are contained rather than not contained):

!($(this).val().indexOf(".png") > -1) || ($(this).val().indexOf(".jpeg") > -1))

Think of that second if test. It's like saying this:

If what you offer me for dinner is not roast chicken or it is not cold ham, then I'll have some

In that situation, you might get some cold ham or you might get roast chicken. Why? Because roast chicken is not cold ham, and because cold ham is not roast chicken. You said you're OK with whatever the kitchen has ready as long as what you get is either not roast chicken or not cold ham, so either of the two satisfies the condition.

If you phrase the qualifier with and instead of or, of course, then the kitchen will have to get creative with the left-over mashed potatoes.

Here's an alternative for and/or conditions. If the value doesn't match the regexp then..

$(".valClear").each(function () {
  if ( !$(this).val().match(/\.(png|jpeg)/) ) {
    $(this).val('');
  }
});

本文标签： jqueryGroup multiple or statements within an IF in javascriptStack Overflow