


js を介してアップロードされた画像情報 (パス、名前、サイズを一時的に保存) を取得し、ajax_javascript スキルを介してバックエンドに渡す方法
プロジェクト要件: アップロードされた画像情報 (一時的な保存パス、名前、サイズ) を js 経由で取得し、それを ajax 経由でバックエンドに渡す方法
サブジェクトは jquery を使用して
を受信します<input name="c_pic" id="c_pic" type="file" class="file">
使用されるメソッドは次のとおりです:
var input = document.getElementById("c_pic"); input.addEventListener('change',readFile,false); function readFile(){ var file = this.files[0]; }
対象者は、アップロードされた画像の関連情報をバックエンドに送信するために ajax post メソッドを使用したいと考えています。受信したファイルは、post を使用して送信できるデータ形式に変換するにはどうすればよいですか?
このトピックを見たとき、それは簡単ではないと思いました。JSON.stringify(file) を介してファイルを直接渡しました (注: stringify() は、オブジェクトから文字列を解析するために使用されます)。 :
var input = document.getElementById("c_pic"); input.addEventListener('change',readFile,false); function readFile(){ var file = this.files[0]; var file_json = JSON.stringify(file); console.log(file_json); //打印出来是: {} $.post('',file_json); }
出力されたのは空のオブジェクトであることがわかりました: {}; それについて何かご存知の場合は、お知らせください。
そこで、私は気が変わり、uploadfile プラグインまたは Baidu の webuploader を使用しました。jQuery File Upload は、複数ファイルのアップロード、キャンセル、削除、アップロード前のサムネイル プレビュー、画像サイズのリスト表示、アップロードのサポート。さまざまな動的言語でのサーバー側の開発をサポートします。
html5 をサポートしている場合は、FormData Ajax を使用してアップロードできます。
上記の内容は、アップロードされた画像の情報(一時的な保存パス、名前、サイズ)をjsで取得し、ajaxでバックエンドに渡すためのエディター側での共通メソッドですので、皆様のお役に立てれば幸いです。

ホットAIツール

Undresser.AI Undress
リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover
写真から衣服を削除するオンライン AI ツール。

Undress AI Tool
脱衣画像を無料で

Clothoff.io
AI衣類リムーバー

AI Hentai Generator
AIヘンタイを無料で生成します。

人気の記事

ホットツール

メモ帳++7.3.1
使いやすく無料のコードエディター

SublimeText3 中国語版
中国語版、とても使いやすい

ゼンドスタジオ 13.0.1
強力な PHP 統合開発環境

ドリームウィーバー CS6
ビジュアル Web 開発ツール

SublimeText3 Mac版
神レベルのコード編集ソフト(SublimeText3)

ホットトピック









JavaScript文字列置換法とFAQの詳細な説明 この記事では、javaScriptの文字列文字を置き換える2つの方法について説明します:内部JavaScriptコードとWebページの内部HTML。 JavaScriptコード内の文字列を交換します 最も直接的な方法は、置換()メソッドを使用することです。 str = str.replace( "find"、 "置換"); この方法は、最初の一致のみを置き換えます。すべての一致を置き換えるには、正規表現を使用して、グローバルフラグGを追加します。 str = str.replace(/fi

記事では、JavaScriptライブラリの作成、公開、および維持について説明し、計画、開発、テスト、ドキュメント、およびプロモーション戦略に焦点を当てています。

この記事では、ブラウザでJavaScriptのパフォーマンスを最適化するための戦略について説明し、実行時間の短縮、ページの負荷速度への影響を最小限に抑えることに焦点を当てています。

フロントエンドのサーマルペーパーチケット印刷のためのよくある質問とソリューションフロントエンド開発におけるチケット印刷は、一般的な要件です。しかし、多くの開発者が実装しています...

この記事では、ブラウザ開発者ツールを使用した効果的なJavaScriptデバッグについて説明し、ブレークポイントの設定、コンソールの使用、パフォーマンスの分析に焦点を当てています。

この記事では、スクリプトのパフォーマンスを大幅に向上させるための10の簡単な手順の概要を説明します。 これらの手法は簡単で、すべてのスキルレベルに適用できます。 更新の維持:NPMのようなパッケージマネージャーを使用して、Viteなどのバンドラーを使用して確認してください

Sequelizeは、約束ベースのnode.js ormです。 PostgreSQL、MySQL、MariadB、SQLite、およびMSSQLで使用できます。このチュートリアルでは、Webアプリのユーザー向けに認証を実装します。また、人気のある認証ミドルであるPassportを使用します

この記事では、jQueryライブラリを使用してシンプルな画像カルーセルを作成するように導きます。 jQuery上に構築されたBXSLiderライブラリを使用し、カルーセルをセットアップするために多くの構成オプションを提供します。 今日、絵のカルーセルはウェブサイトで必須の機能になっています - 1つの写真は千の言葉よりも優れています! 画像カルーセルを使用することを決定した後、次の質問はそれを作成する方法です。まず、高品質の高解像度の写真を収集する必要があります。 次に、HTMLとJavaScriptコードを使用して画像カルーセルを作成する必要があります。ウェブ上には、さまざまな方法でカルーセルを作成するのに役立つ多くのライブラリがあります。オープンソースBXSLiderライブラリを使用します。 BXSLiderライブラリはレスポンシブデザインをサポートしているため、このライブラリで構築されたカルーセルは任意のものに適合させることができます
