Question

在我的应用程序中，我使用循环生成多个file_upload控件，如下所示：

<div class='row' id='selfintroduction'>
    <% @sections.each do |s| %>
        <span class='label' style="font-size:small;font-weight:bold">
            <%= s.SectionName %>
        </span>
        <br/>
        <span class='formw' style="font-size:small">
            <input type='file' id='Self' name='Self'/> // File upload  control
        </span>
    <% end %>
</div>

在@sections循环中，我有SectionName，我正在生成file_upload控制以及每个SectionName。我想使用jQuery在file_type方法的file_upload控件上应用onchange验证，但问题是多个file_upload控件具有相同的ID，即

<input type='file' id='Self' name='Self'/>

然后我附上了SectionName以及file_upload控件id，即

<input type='file' id='Self[<%= s.SectionName %>]'

下面是onchange方法，我使用file_upload得到id控制值：

<script type="text/javascript">
    $(document).ready(function() {
        var i = 0;
        $("#Self["+ i +"]").on('change',function() {
            alert("Self["+ i +"]");
        });
    });
</script>

但在上述onchange方法中，我无法通过file_upload获取id控件SectionName来区分每个file_upload控件。我怎么能这样做？

请建议我，等待回复。感谢

Answer 1

HTML：

<input type='file' id='Self' class="inputfileupload" name='Self'/>

JQUERY：

    $(document).ready(function(){
      $( ".inputfileupload" ).change(function() {
        alert($(this).attr('id'));

        var url = this.value;
        var ext = url.substring(url.lastIndexOf('.') + 1).toLowerCase();
        if (input.files && input.files[0]&& (ext == "gif" || ext == "png" || ext == "jpeg" || ext == "jpg")) {

           alert("Valid image");
        }else{
           alert("Image format not valid");
        }
      });

    });

检查this堆栈以验证多个文件上传（您可以使用jquery验证）。

如何在RoR中通过id区分每个file_upload控件

1 个答案: