입력 글꼴을 변경하는 방법은 무엇입니까?

확인란을 사용하여 입력 태그의 글꼴을 전환해야합니다.이를 위해 javascript 및 @ font-face를 사용해 보았습니다.입력 글꼴을 변경하는 방법은 무엇입니까?

HTML :

<form action="#" method="post"> 

<input id="comment-input" type="text" class="form-control input-sm" placeholder="Press enter to post comment">     

<span class="input-group-addon sinhala"> 
Sinhala 
<input type="checkbox" aria-label="..." value="si" id="sinhala-toggle-checkbox"> 
</span> 


<button type="button" class="btn btn-sm" data-toggle="tooltip" title="" data-original-title="Mark as read">Post</button> 

</form> 

<script> 
$("#sinhala-toggle-checkbox").click(function(){ 
$("#comment-input").toggleClass("sinhala"); 
}); 
</script>

CSS :

@font-face {font-family: sinhala; 
    src: url("malithi_web.ttf") format("truetype"); 
} 

.sinhala[type='text']{ 
    font-family: "Malithi web" !important; 
    font-size:16px; 
    font-style:normal; 
}

출처

2016-06-09 mzmarkib

글꼴이 변경되지 않고 글꼴이 변경되지 않습니다. – mzmarkib

btw 서버에서 글꼴 (사용자 정의)을로드하려고 시도했습니다. – mzmarkib

내 브라우저/PC에 문제가 있다고 생각합니까 ?? 나는 심지어 크롬에 직접 쓰지 못하게하려고했다. – mzmarkib

당신은 다른 클래스에 새 글꼴을 가질 수 있습니다. 그런 다음이 클래스를 토글합니다.

.newFontClass{ 
     font-family: "Some-New-Font" !important; 
    } 

    $("#sinhala-toggle-checkbox").click(function(){  
     if($(this).is(':checked')) { 
      $("#comment-input").addClass("newFontClass"); 
     }else{ 
     $("#comment-input").removeClass("newFontClass"); 
     } 
    });

출처

2016-06-09 21:06:20 Don

시도해 보았지만 여전히 글꼴을 변경하지 않았습니다. 글꼴이 유니 코드이기 때문에 일 가능성이 있습니까? – mzmarkib

고맙습니다. 유니 코드가 아닌 글꼴을 사용해 보았습니다. 그 글꼴은 모든 제안과 함께 작동했습니다. – mzmarkib

코드에서 올바른 jQuery를 CDN을 추가 확인하십시오 : -

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>

CDN 다음 그냥 당신의 포스트 스크립트 교체 올바른 경우 : -

SCRIPT :

를

$(document).ready(function(){ 
    $("#sinhala-toggle-checkbox").click(function(){ 
    $("#comment-input").toggleClass("sinhala"); 
    }); 
});

나머지 전체 코드가 정확합니다.

출처

2016-06-09 21:11:48

코드를 편집 할 수없는 경우 코드를 수정하는 방법. 내가 게시 한 코드는 문제의 해결책입니다. –

코드를 잘 작성했다면 코드에 게시 한 스크립트를 추가해야합니다. –

시도해 봤지만 여전히 글꼴을 바꾸지 않았습니다. 글꼴이 유니 코드이기 때문에 어쩌면? – mzmarkib

입력 글꼴을 변경하는 방법은 무엇입니까?

답변

관련 문제