コミュニティ 学ぶ ツールライブラリ レジャー
検索
日本語
ホームページ > ウェブフロントエンド > jsチュートリアル > JavaScript 複数画像アップロード case_javascript スキル

JavaScript 複数画像アップロード case_javascript スキル

WBOY
リリース： 2016-05-16 15:37:47
オリジナル
1476 人が閲覧しました

JS マルチ画像アップロードの小さな例: 

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title>上传多图片</title>
  <script type="text/javascript">
    function JM_wu(ob) {
      ob.style.display = "none";
    }
    function JM_you(ob) {
      ob.style.display = "";
    }
    function createForm(textN, number) {
      data = "";
      inter = "'";
      if (number < 11 && number > -1) {
        for (i = 1; i <= number; i++) {
          if (i < 10) spaces = " ";
          else spaces = " ";
          data = data + " <input name=" + textN + i + " type=text value='' size='30' maxlength='100'>"
          + "<INPUT TYPE='button' value='上传" + i + "' onclick=javascript:uppic('more" + i + "','more" + i + "')>";
        }
        if (document.layers) {
          document.layers.cust.document.write(data);
          document.layers.cust.document.close();
        }
        else {
          if (document.all) {
            cust.innerHTML = data;
          }
        }
      }
      else {
        window.alert("请不要超过10张图片.");
      }
    }
</script>
</head>
<body>
  <form name="prodtable" action="">
  <input type="radio" name="more_pic" checked value="0" onclick="JM_wu(s1)">无
  <input type="radio" name="more_pic" value="1" onclick="JM_you(s1)">有 <span id="s1" style="display:none">
    <input name="more" type="text" value='1' size='5' maxlength='2'>
    <input type="button" value="张大图" onclick="createForm('more',document.prodtable.more.value);">
    <span id="cust" style="position: relative;"></span></span>
  </form>
</body>
</html>
ログイン後にコピー

これはガイダンスのほんの一例にすぎません。生徒はボタンを画像の参照ボタンに置​​き換えることができます。

関連ラベル：
javascript 写真をアップロードする
ソース：php.cn
前の記事：ASP知識整理メモ3（質疑応答モード）_JavaScriptスキル 次の記事：JS はマウスのエフェクト_JavaScript スキルを使用してアバターと記事リストのコードを実装します
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
最新の問題
JavaScript を使用せずにクリック時に画像ソースを動的に変更する CSS のみのメソッド img:active{} のような CSS のみを使用して、マウスクリック時に画像の src を変更する必要があります
から 2024-04-06 19:25:49
0
1
505
d3.js でズームインすると散布図のポイントの値が維持されない d3.js を使用するのは初めてなので、ご容赦ください。 vue.js ファイルに純粋な JavaScript として実装しました。ズーム機能を使用して散布図を作成しようとしていま...
から 2024-04-06 18:16:26
0
1
403
ベンダー固有の疑似要素上の JavaScript ホバー イベント 次の htmlinput タグがあります。 $("input[type='range']::-webkit-slider-thumb").on('hover',...
から 2024-04-06 15:35:24
0
1
274
Javascript/Jqueryを使用してボタンなしでフォームを送信する JavaScript 関数を呼び出し、JQUERY/PHP を使用してフォームを実行することにより、ボタンのないフォームを送信しようとしています。ページを再読み込みせずに、バックエ...
から 2024-04-06 14:54:03
0
2
421
CollapseDisplay クラスを使用してブートストラップ アコーディオン ヘッダーの外観をカスタマイズする class Collapseshow を使用してパネルのカード タイトルのスタイルを設定したいと考えています。この例では、最初のパネルです。 CSS を使用して .accordio...
から 2024-04-06 12:53:11
0
1
376
関連トピック
詳細>
人気のおすすめ
人気のチュートリアル
詳細>
関連するチュートリアル
人気のおすすめ
最新のコース
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート