2

私の問題は、友人のためにサイトを設計していることです。私が行ったことは、それぞれの画像を新しいウィンドウで開き、印刷し、ウィンドウを閉じるボタンをそれぞれの下に持つサムネイルのリストを設定することです。ここで、サムネールの横にチェックボックスが必要であると判断しました。これを選択すると、ボタンをクリックすると、選択したすべての画像が印刷されます。これは可能ですか？もしそうなら、誰かが私にそれを説明してもらえますか? 御時間ありがとうございます。

4

1 に答える 1

6

考えられる多くの方法のうち、これを行う方法の 1 つを次に示します。

ステップ1：すべてを囲むフォームを作成し、フォーム内で、各画像の横または下に、一意のIDを持つチェックボックスを配置します。たとえば、どの画像であるかを識別するために使用できます

<input type="checkbox" id="imageNumber3"/>

後でIDを使用して、どの画像が意図されているかを判断できるようにするためです. フォームとチェックボックスについて読んでください。

ステップ2：JavaScript関数を作成して、現在どのチェックボックスが選択されているかを取得します

function getChecked(form) {
    var names;
    var c = document.getElementById(form).getElementsByTagName('input');
    for (var i = 0; i < c.length; i++) {
        if (c[i].type == 'checkbox' && c[i].checked) {
             names.append(c[i].id);
        }
    }
    return names;
}

この関数は、チェックボックスがあるフォームの ID を指定するときに、各ボックスを調べてチェックし、チェックされているかどうかを確認する必要があります。選択された ID の配列を作成し、その配列を返します。

ステップ3：ボタンがクリックされたときに呼び出される新しい印刷機能を作成します

function printBunch(ids) {
    var windowUrl = 'about:blank';
    var uniqueName = new Date();
    var windowName = 'Print' + uniqueName.getTime();

    var printWindow = window.open(windowUrl, windowName, 'left=50000,top=50000,width=0,height=0');

    for(id in ids) {
        //assuming the image will be the next sibling of the checkbox
        var currentImage = document.getElementById(id).nextSibling.innerHTML;
        printWindow.document.write(currentImage);
    }
    printWindow.document.close();
    printWindow.focus();
    printWindow.print();
    printWindow.close();
 }

次に、ボタンの onclick に「printBunch(getChecked());」を入力します。チェックされた画像のIDを渡します。チェックボックスに関連して画像を設定する方法に応じて、コードの一部を変更する必要がある場合がありますが、これで作業を開始できます。

于 2012-06-14T21:02:22.533 に答える