1

jquery フォームを使用して、ページを更新せずに画像をアップロードしています。以下は、html マークアップです。

    <a href="javascript:void(0);" onclick="UpdateImage();"> 
<img src="@_fullImgPath" name="img-uploader" alt="" title="" /></a>

    @using (Html.BeginForm("UpdateImage", "Profile", FormMethod.Post, new { id = "img-file-upload-form", @class = "form", autocomplete = "off", enctype = "multipart/form-data" }))
    {
        @Html.Hidden("UpdateImageId")
        <input type="file" name="file" id="file" />
    }
    <script language="javascript" type="text/javascript">   
     $(function () {
        $("#img-file-upload-form").ajaxForm({
            iframe: true,
            dataType: "json",
            beforeSubmit: function () {
            },
            success: function (result) {
                alert('done');
            },
            error: function (xhr, textStatus, errorThrown) {
                alert('error');
            }
        });

        $("#file").change(function () {
             $("#img-file-upload-form").submit();
        });
    });

     function UpdateImage(id) {
            $("input[id=file]").click();
        }

    </script>

これは Firefox と Chrome では問題なく動作しますが、IE 8 と 9 ではアクセス拒否エラーがスローされます。これに対する修正はありますか？または、ページを更新せずに画像をアップロードする代替手段はありますか?

4

1 に答える 1

0

あなたがしようとしているのは、フォーム送信時に画像を保存することです。フォームを送信すると、マークアップがMVC-3 Razorを表していると思われるため、Web ページのポストバックが行われます。

むしろ、ajax リクエストには以下を使用することをお勧めします。

   var submitForm=new Form();

フォーム コントロールに画像を追加する

$.ajax({
    url:'webpage or your method in controller',
    type:'POST/GET',
    data:submitForm,
    dataType:'',
    ContentType:'',
    beforeSend:function(){},
    complete:function(){}, .....
});

動的フォーム タグの作成については、次のリンクを参照できます
JavaScript を使用して動的にフォームを作成する方法は?

于 2012-12-18T11:55:26.233 に答える