JavaScript を少し取り入れながら、シンプルな HTML と CSS の Web ページを作成しようと試み始めました。印刷しても表示されないシンプルな印刷ボタンを作ろうとしています。私はさまざまな答えを求めて SA の周りを検索しましたが、link media= "print"
. display: none
スタイルシートには、またはのいずれかを記述するクラスになりますvisibility: hidden
。次に、それをボタンに適用します。
問題は、試してみると、ページのプレビューがポップアップしても非表示にならないことです。ここに私のメインコードがあります:
<link rel="stylesheet" href="print.css"
type="text/css" media="print" />
<script type = "text/javascript">
function newPerson(firstname, lastname, age, gender, birthmonth, birthdate) {
this.firstname = firstname;
this.lastname = lastname;
this.age = age;
this.gender = gender;
this.birthmonth = birthmonth;
this.birthdate = birthdate;
this.birthyear = birthdayCalculate;
}
function birthdayCalculate() {
var date = new Date();
var CurYear = date.getFullYear()
var CurMonth = date.getMonth()
var birthyear = CurYear - this.age
if (this.birthmonth > CurMonth) {
birthyear --
}
return birthyear
}
function testFunction(form) {
var firstName = form.firstName.value
var lastName = form.lastName.value
var Age = form.Age.value
var Gender = form.Gender.value
var birthMonth = form.birthMonth.value
var birthDate = form.birthDate.value
var new1 = new newPerson(firstName, lastName, Age, Gender, birthMonth, birthDate)
var person = new1.firstname + " " + new1.lastname + " is " + new1.age + " and is " + new1.gender + " and was born on "
+ new1.birthmonth + "/" + new1.birthdate + "/" + new1.birthyear() + "." + "<br />"
document.write(person);
winVar = window.open();
winVar.document.write(person);
winVar.focus();
winVar.document.write(
"<input type='button' " +
"onClick= 'window.print();'" +
"value ='Print This Page' " +
"class = 'print' " +
"/>");}
</script>
私がフォームを使用したことがわかると思います。これを見せる必要はないと思います。print .css も非常に単純です。
.print{
visibility: hidden
}
誰かが私のスクリプトに何か問題があると思いますか? ちょっとしたことですが、私は Google Chrome を使用しています。