事件触发

以下HTML使用Jasny Bootstrap mod fileinput.js 事件触发

<div class="profile_image"> 
      <form accept-charset="UTF-8" action="https://stackoverflow.com/users/5/update_image" class="edit_user" data-remote="true" enctype="multipart/form-data" id="edit_user_5" method="post"><div style="margin:0;padding:0;display:inline"><input name="utf8" type="hidden" value="✓"><input name="authenticity_token" type="hidden" value="xx6ELZRrTR6XDzmujIPBsCkr8zbK19I/7CprOOTiblM="></div> 
       <div class="fileinput fileinput-new" data-provides="fileinput"> 
        <div class="fileinput-preview thumbnail" data-trigger="fileinput" style="width: 200px; position: relative;"> 
         <img alt="7bbfd77c 1102 4831 9ba8 246fb67460b3.2014 01 17" class="img-responsive" src="http://myweb.com/image.jpg"> 
         <div class="choose_new"> 
         </div> 
        </div> 
        <div class="btn-file"> 
          <input id="user_avatar" name="user[avatar]" type="file"> 

        </div> 
       </div> 
        <input name="commit" type="submit" value="Submit"> 
      </form> 

     </div>

我要听change.bs.fileinput事件自动提交使用

一旦图像被选择

形式

$(".fileinput").on("change.bs.fileinput", function(e) { 
    e.stopPropagation(); 
    alert(); 
    return false; 
});

这样做会导致2个警报

哪有我解决这个问题？

来源

2014-02-13 Nick Ginanto

你试过用** $（ 'form.edit_user'）提交。（）; **？ –

我遇到了同样的问题。你有没有设法找出是什么原因造成的？ – mmalmeida

请注意，这只会在将bootstrap-spinner.js文件添加到页面（） – mmalmeida

我相信问题与fileinput的版本有关。这里是一个jsfiddle使用文件输入版本3.0.0-p7（代码如下）

展示问题，如果我们更新小提琴版本3.1.3（http://cdnjs.cloudflare.com/ajax/libs/jasny-bootstrap/3.1.3/js/jasny-bootstrap.min.js），那么问题将不会显现自己。

的jsfiddle SHOWCASE（使用jQuery 1.11.0和的FileInput-3.0.0-P7添加的资源）：

jQuery(document).ready(function() { 
    $('#file-upload').on('change.bs.fileinput', function(event) { 
     event.stopPropagation(); 
     alert("yy"); 
     console.log(event); 
    }); 
}); 

<div id="file-upload"> 
    <div class="fileinput fileinput-new" data-provides="fileinput"> 
     <span class="btn default btn-file"> <span class="fileinput-new"> SELECT </span> <span class="fileinput-exists"> CHANGE</span> <input id="uploadID" 
      type="file" name="upload"> <input type="hidden" id="answerId" value="85009"> 
     </span> <span class="fileinput-filename"> </span> &nbsp; <a href="#" class="close fileinput-exists" data-dismiss="fileinput" style="float: none"> </a> 
    </div> 
</div>

来源

2014-08-21 11:13:16 mmalmeida

也注意到这个问题得到报告和解决在v 3.1.1 https://github.com/jasny/bootstrap/issues/182 –

您可以使用“提交”事件提交表单，而不是触发“点击”。

$(".fileinput").on("change.bs.fileinput", function(){ 
     $("#edit_user_5").submit(); 
     return false; 
}

来源

2014-02-13 14:19:44 cardeol

仍然没有帮助，看我编辑 –

回答

相关问题