title: select file browser is not working for input type file using Jquery or javascript
body: <p>I am facing one issue. The file select explorer is closing after 3 times click using jquery. I am explaining my code below.</p>
  
  <p><strong>header.html:</strong></p>
  
  <pre><code>$(document).on('click', '.browse', function(){
      var file = $(this).parent().parent().parent().find('.file');
      file.trigger('click');
  });
  $(document).on('change', '.file', function(){
     $(this).parent().find('.form-control').val($(this).val().replace(/C:\\fakepath\\/i, ''));
  });
  &lt;div class="form-group" style="margin-bottom:0px;"&gt;
  &lt;input type="file" name="logoimage" id="logoimage" ng-model= "form.logoimage" onchange="angular.element(this).scope().uploadedImage(this);" accept=".gif,.jpg,.jpeg,.png" class="file"&gt;
  &lt;div class="input-group col-xs-12"&gt;
  &lt;input type="text" class="form-control" placeholder="Upload Logo" name="setlogoimage" id="setlogoimage" ng-model="setlogoimage"&gt;
  &lt;span class="input-group-btn"&gt;
  &lt;button class="browse btn btn-primary" type="button"&gt;Upload File&lt;/button&gt;&lt;/span&gt; 
  &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>The above is my header file which has one input type file functionality.</p>
  
  <p><strong>audit.html:</strong></p>
  
  <pre><code>$(document).on('click', '.browsebtn', function(){
    var file1 = $(this).parent().parent().parent().find('.filepath');
    file1.trigger('click');
    console.log('audit');
  });
  $(document).on('change', '.filepath', function(){
    $(this).parent().find('.form-control').val($(this).val().replace(/C:\\fakepath\\/i, ''));
  });
  &lt;div ng-include src="'header.html'"&gt;&lt;/div&gt;
  &lt;div class="form-group" style="margin-bottom:0px;"&gt;
  &lt;input type="file" ng-model="form.filencdoc" multiple name="ncevidencefile[]" class="filepath" onchange="angular.element(this).scope().uploadedFile(this,4);"&gt;
   &lt;div class="input-group col-xs-12"&gt;
   &lt;span class="input-group-addon"&gt;&lt;i class="fa fa-file-text-o" aria-hidden="true"&gt;&lt;/i&gt;&lt;/span&gt;
  &lt;input type="text" style="display: block; width: 100%; height: 34px; padding: 6px 12px; font-size: 14px; line-height: 1.42857143; color: #555; background-color: #fff; background-image: none; border: 1px solid #ccc;" placeholder="Link to Evidences" ng-model="ncshowimp" id="ncshowimp"&gt;
   &lt;span class="input-group-btn"&gt;
  &lt;button class="browsebtn btn btn-primary" type="button" style="border-radius: 0 3px 3px 0" id="browsbttn"&gt;Browse&lt;/button&gt;
   &lt;/span&gt;          
   &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Now let me explain the scenario. Lets say from the beginning user is in the <strong><code>header.html</code></strong> page  and click on some next button it redirected to <strong><code>audit.html</code></strong> page. Then when user come back to <strong><code>header.html</code></strong>  and select the input type file to select the file, the file explorer is opening but after 3 times click on <strong><code>cancel/select</code></strong> button it is closing which is my issue.</p>
  
  <p>Usually it should close at one time click. Please help.</p>