2010-11-23 4 views
0

사용자가 글꼴을 변경할 수 있도록하려는 3 개의 텍스트 입력 상자가 있지만이 작업을 수행하는 방법이 확실하지 않습니다. 선택 상자를 사용하여 jquery로 글꼴을 변경하십시오.

내 미리보기 상자에 대한 코드입니다 :

<script type="text/javascript"> 
$(function() 
{ 
    $(".line1").keyup(function() 
    { 
    var word=$(this).val(); 
    $(".line_preview1").html(word); 
    return false; 
    }); 
    $(".line2").keyup(function() 
    { 
    var word=$(this).val(); 
    $(".line_preview2").html(word); 
    return false; 
    }); 
    $(".line3").keyup(function() 
    { 
    var word=$(this).val(); 
    $(".line_preview3").html(word); 
    return false; 
    }); 
}); 
</script> 


<span class="line_preview1"></span> 
<span class="line_preview2"></span> 
<span class="line_preview3"></span> 
<input type="text" name="line1" class="line1" /> 
<input type="text" name="line2" class="line2" /> 
<input type="text" name="line3" class="line3" /> 

난 상황

에 대한

편집 좋을 것 각 행의 글꼴을 선택할 수 있다면 나는 싶습니다 있다;

<select name=font> 
<option>Arial</option> 
<option>Verdana</option> 
<option>Times New Fubar</option> 
</select> 

새로운 옵션이 선택 될 때, 그것은

+0

'글꼴 선택 '이란 무엇을 의미합니까? 사용자가 어딘가에 글꼴 이름을 입력 할 수 있어야합니까? –

+0

일부 상황이 추가되었습니다. – mrpatg

답변

1

당신은 CSS는 방법을 설명합니다 여기에 기사있다 .css()

$("a#change_font").click(function(){ 
    $("div#fontchange").css('font-family', 'Courier, mono'); 
}); 

<a href="#" id="change_font">Change it!</a> 
<div id="fontchange">Hello World!</div> 

와 속성을 변경할 수있는 특정 미리보기 요소의 CSS를 업데이트 할 것 선택 값으로 사용하려면 Getting Select List Values.

관련 문제