jQuery选择器问题

问题描述

| 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? 
  });

谢谢。     

解决方法

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

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

您还有其他打算要这样做吗？     ,为什么需要选择该元素？您可以用

$(\'#id_profile_pic\')

来完成此操作，但是您不应该只提交表格以便实际上载吗？     ,

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

});

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

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

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

});

    ,您应该以完全相同的方式进行操作：使用哈希（

#

）：

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

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

    ,这也可以做到：

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

这将以发布的形式查找文件控件，而不管标记结构如何（并且无需知道控件ID）。 正如perl僧侣所说的那样，TMTOWTDI。