0

2つのフォントフェースを使用していて、jQueryを使用してそれらを切り替えたいのですが、フォントフェースの名前は「ArvoBold」であり、次を使用すると次のようになります。

css('font-family','ArvoBold')

ArvoBold（引用符なし）という名前の存在しないフォントに変わります！私はそれを動作させることを試みました：

css("font-family","'ArvoBold'")

しかし、それは機能していないようです。また、変数を作成しようとしました。

var fontvar="'"+"ArvoBold"+"'";
css('font-family',fontvar);

また、要素のCSS（Google Chromeのインスペクターを使用してチェック）では、「ArvoBold」の代わりにArvoBoldを使用し続けるため、成功しませんでした。

誰かが私を助けることができますか？

前もって感謝します！

ジョン

4

3 に答える 3

2

正確な実装はわかりませんが、これは文字列内の一重引用符をエスケープすることで機能します。

$(".font-face").css("font-family","\'ArvoBold\'");

なぜ一重引用符が必要なのですか?

一重引用符のエスケープに関するクイック テストでは、コンテンツ div に「ArvoBold」が出力されます。

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>   
<style>
#content{border:solid 1px red;width:100px;height:100px;text-align:center;}
</style>
</head>

<body>

<div id="content"></div>

<script type="text/javascript">
$(document).ready(function(){
$("#content").html("\'ArvoBold\'");
});
</script>

</body>
</html>
于 2012-08-10T14:21:58.357 に答える
1

セレクターを定義し、 css（）ブラケットを修正する必要があります。

これがjsFiddleの動作です。 

var fontvar = 'ArvoBold';
$('.mySelector').css({'font-family':fontvar});​

注： $（document）.ready（）も使用することを忘れないでください。

于 2012-08-10T14:17:28.220 に答える
0

CSSでは、次のように記述できます

font-family: Arial;

としても

font-family: 'Arial';

と同じ意味です。したがって、

'ArvoBold'

引用符は、文字列の一部としてではなく、文字列の区切り記号として解釈されます。

引用符をエスケープしてみてください。

font-family: "\'ArvoBold\'"

ただし、BoltClock の質問を繰り返さなければなりません: なぜフォント名に引用符が付いているのですか?

于 2012-08-10T14:20:43.253 に答える