jquery-mobile - 如何在查询手机中更改全身字体系列。？

Question

你能告诉我如何更改整个应用程序的字体系列。我可以更改字体大小。但现在我需要在我的应用程序中更改字体类型。我怎样才能做到这一点？

从这里我改变字体：

div data-role="fieldcontain">
    <label for="text-12" style="text-align:left;margin-left: 0px;">Display Font:</label>
    <select name="select-choice-1" id="select-choice-1">
        <option>Select Font</option>
        <option value="9">9 px</option>
        <option value="10">10 px</option>
        <option value="11">11 px</option>
        <option value="12">12 px</option>
        <option value="13">13 px</option>
        <option value="14">14 px</option>
        <option value="15">15 px</option>
        <option value="16">16 px</option>
        <option value="17">17 px</option>
    </select>
</div>

$(document).on('change', '#select-choice-1', function() {

    var style;
    var font = $(this).val();
    if ($('head').find('style.font').length === 0) {
        style = $('<style class="font">.font { font-size: ' + font + 'px !important; }</style>');
        $('head').append(style);
        $('body *').addClass('font');
    } else {
        $('body *').removeClass('font');
        $('style.font').empty();
        style = '.font { font-size: ' + font + 'px !important; }';
        $('style.font').append(style);
        $('body *').addClass('font');
    }
});

现在我需要更改字体系列怎么办？

<div data-role="fieldcontain">
     <label for="text-12" style="text-align:left;margin-left: 0px;">Display Font:</label>
     <select name="select-choice-1" id="select-choice-1">
         <option>Select Font family</option>
         <option value="AntiquaAntiqua">AntiquaAntiqua</option>
         <option value="Arial"> Arial </option>
         <option value="Blackletter">Blackletter</option>
     </select>
</div>

Answer 1

试试下面的。我不知道 classesToChange 变量是否包含所有需要更改的类，但它对我来说很好。

HTML：

<select id='select-choice-1'>
  <option>Select Font family</option>
  <option value="AntiquaAntiqua">AntiquaAntiqua</option>
  <option value="Arial"> Arial </option>
  <option value="Blackletter">Blackletter</option>
</select>

JavaScript

$("#select-choice-1").change(function(){
  var fontFamily = $(this).val() || "Arial"; 
  var classesToChange = ".ui-body-c,.ui-btn-text,.ui-li-divider,.ui-header,.ui-li,.panel";
  $(classesToChange).css("font-family", fontFamily);
});