jQueryが動作しない

wilsher
(@wilsher)

9年、 2ヶ月前

http://aiai-housing.sakura.ne.jp/wp/
の各物件詳細ページに、印刷プレビューボタンを設置しようとしています。

印刷プレビューボタン表示
<span class=”print-preview”>印刷プレビュー</span>

印刷プレビュー動作コード
$(function() {

//プリントプレビュークリックイベント
$(document).on(‘click’,’.print-preview’,function(){
doPrintPreview();
});

});

/**
* プリントプレビュー
*/
doPrintPreview = (function(){
//現在のURLに’print’パラメータを付加し、新しいウィンドウで表示させる。
window.open(location.href+’?print=true’);
});

印刷プレビュー表示の際の処理
$(function() {
//URLパラメータに’print’が存在する場合、
if (location.href.indexOf(‘?print’) > -1) {
//bodyにprintクラスを付加。
$(“body”).addClass(‘print’);

//.btnBoxの中身を空にし、印刷ボタンをアペンド。
$(‘.btnBox’).html(”).append(‘<input type=”button” value=”印刷する” id=”doPrint” name=”doPrint”>’);

//印刷ボタンのクリックイベントに印刷機能を設定
$(‘#doPrint’).on(‘click’, function(){
window.print();
});

}
});

印刷プレビュー用スタイルシート
@charset “UTF-8”;

/*——————————————

プリントプレビュー用

——————————————*/

body.print {

body {
/* フォントを濃く */
color:#111;
/* 背景を白に */
background-color:#fff;
}
#header,
#bc,
#side,
#footer
{
/* 非表示 */
display:none;
}
#content {
/* 幅をブラウザに任せる */
width: auto;
padding: 0;
float: none;
background-color: #fff;
}
table td,
table th {
/* ボーダーを濃く */
border:solid 1px #000 !important;
}

}

@media print {
/* 通常のプリントは見たままを印刷したい。 */
/* 印刷ボタンを表示しているボックスだけ印刷時に非表示 */
.btnBox {
display:none;
}
}

参考ページ
http://milkyshade.com/javascript/741/

それぞれのコード書く場所や、スタイルシートを読み込むコードを書く場所が分かりません。
散々試してみましたが、動作しません。

ご教授くださいm(__)m