if(element:contains) constantly returns true 无论涉及什么值或元素

Question

我试图隐藏表单的提交按钮，直到使用 jQuery 选择了某种文件。

<input type="file" id="file">
<input type="submit" id="submit">

if($("#file:contains('.png')")) {
    alert("Yep, that's a PNG image");

    $('#submit').show();
}

jQuery constantly returns true 无论涉及什么值或元素，一旦页面加载警报就会出现并通知我文件输入包含“.png”

顺便说一下，我知道这并不是真正正确的方法。我相信你可以通过使用 inspect element 来解决这个问题。

Answer 1

使用选择器调用 jQuery 将始终 return 一个 jQuery 对象，该对象始终为真，这就是为什么 if 条件为 return true总是。

同时 :contains 检查元素的文本内容，而不是值，因此您需要检查文件的值是否包含 .png

$('#file').change(function() {
  var png = /\.png$/.test($('#file').val());
  if (png) {
    alert("Yep, that's a PNG image");
  }
  $('#submit').toggle(png);
})

#submit {
  display: none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input type="file" id="file">
<input type="submit" id="submit">

Answer 2

DEMO

我希望你能在 input file 的 change event 中做到这一点。所以我建议在下面解决这个问题：

$('#file').change(function(e){
      var file = $(this).val();
      if(file!="" && file != null)
      {
          var ext = file.split('.').pop();//get the type
          if(ext=="png")
          {
               alert("Yep, that's a PNG image");
               $('#submit').show();
          }
          else
          {
               alert("Yawk!! Bad file");
               $('#submit').hide();
          }
      }
});

if(element:contains) constantly returns true 无论涉及什么值或元素

if(element:contains) constantly returns true no matter what value or elements are involved

forms

jquery

contains

submit