Question

jQuery新手。

我有以下html：

  <form enctype="multipart/form-data" action="/upload/" method="post"> 
      <div class="field"> 
          <label for="id_profile_pic">Profile Pic</label> 
          <input type="file" name="profile_pic" id="id_profile_pic" /> 
      </div> 

      <div> 
      <span>Profile Picture</span> 
      <img src="/site_media/profile_pic/4e17c792-3c34-4556-8c67-135bc931eb5a.jpg"/> 
      <input type="button" value="Upload" id="upload_button" /> 
      </div> 
  </form>

我需要在以下功能中使用选择器

  $('#upload_button').click(function() {
    //how can I select the file input element (ie. #id_profile_pic) here? 
  });

感谢。

Answer 1

您可以像定位初始选择器中的第一个那样定位该元素：

  $("#id_profile_pic").doStuff();

你还有什么意思吗？

Answer 2

为什么需要选择该元素？您可以使用$('#id_profile_pic')进行此操作，但是您不应该仅仅提交表单以便实际上传吗？

Answer 3

$('#upload_button').click(function() {
    // to select it here you just need
    $('#id_profile_pic')

});

如果您想选择可以使用的表格中的所有图片：

$('#upload_button').click(function() {

    $(this).parent().find('img');

});

Answer 4

你应该采用完全相同的方式：使用哈希（#）：

$('#upload_button').click(function() {
    var fileUploadPic = $('#id_profile_pic');

    var value = fileUploadPic.val();
});

Answer 5

这也会这样做：

$('#upload_button').click(function(){
  var file = $(this).closest('form').find('input[type=file]') ;
  return ;
} ;

无论标记结构如何（无需知道控件ID），都会在发布的表单中找到文件控件。

TMTOWTDI，正如perl僧侣所说。

jQuery选择器问题

5 个答案: