0

選択ボックス内の要素のみを表示したい選択ボックスがあるページを印刷したい（選択ドロップダウン矢印も表示しない）。したがって、ユーザーがこのページを印刷すると、「アイテムの選択」テキストだけでなく、選択ボックス内のすべての要素が表示されます。

<html>
<head></head>
<body>
     <select> <option selected> Select item </option>
                            <option value="1" > 10 </option>
                            <option value="2"> 20 </option>
                            <option value="3"> 30 </option>
                            <option value="4"> 40 </option>
     </select>
</body>
</html>
4

1 に答える 1

0

選択したアイテムを div に正確に複製し、非表示にします。例えば

<div class="printselector" style="display:none">10,20,30,40</div>

次に、印刷スタイルシートで、これが表示されていることを確認し、ボックスが非表示であることを選択します。

したがって、完成した html は次のようになります。

<html>
<head>
<link rel="stylesheet" href="print.css" type="text/css" media="print" />
<style type="text/css">
    .myselector { display: block}
</style> 
</head>
<body>
     <select class="myselector"> <option selected> Select item </option>
                            <option value="1" > 10 </option>
                            <option value="2"> 20 </option>
                            <option value="3"> 30 </option>
                            <option value="4"> 40 </option>
     </select>
    <div class="printselector" style="display:none">10,20,30,40</div>
</body>
</html>

次のコードを含む別の print.css ファイルがあります。

.printselector { display:block !important; }
.myselector { display:none !important; }
于 2012-06-21T06:00:19.897 に答える