Изменить размер шрифта метки с помощью Jquery

Question

Jquery:

$("#size").on('change',function(){ 
    var getValue=$(this).val(); 
    //alert(getValue); 
    $("#lbll").css("font-size",getValue); 

}); 

HTML:

<select name="fontsize" id="size"> 
     <option id="size6">6</option> 
     <option id="size8">8</option> 
     <option id="size9">9</option> 
     <option id="size10">10</option> 
     <option id="size11">11</option> 
     <option id="size12">12</option> 
     <option id="size14">14</option> 
     <option id="size18">18</option> 
     <option id="size24">24</option> 
     <option id="size30">30</option> 
     <option id="size36">36</option> 
     <option id="size48">48</option> 
     <option id="size60">60</option> 
     <option id="size72">72</option> 
    </select> 

<label id="lbll">fooo</label> 

Я хочу, чтобы изменить размер шрифта моего ярлыка по выбору моего списка. Я пробовал некоторые методы, но никто из них, похоже, не работает. Любая идея, что не так с моим кодом?

Answer 1

код изменение этой

<select name="fontsize" id="size"> 
    <option value="6px">6</option> 
    <option value="8px">8</option> 
    <option value="9px">9</option> 
    <option value="10px">10</option> 
    <option value="11px">11</option> 
    <option value="12px">12</option> 
    <option value="14px">14</option> 
    <option value="18px">18</option> 
    <option value="24px">24</option> 
    <option value="30px">30</option> 
    <option value="36px">36</option> 
    <option value="48px">48</option> 
    <option value="60px">60</option> 
    <option value="72px">72</option> 
</select> 

<label id="lbll">fooo</label> 

Here the working fiddle

Answer 2

Вы должны указать блок, как показано ниже:

$("#size").on('change', function() { 
 
    $("#lbll").css("font-size", this.value + "px"); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select name="fontsize" id="size"> 
 
    <option id="size6">6</option> 
 
    <option id="size8">8</option> 
 
    <option id="size9">9</option> 
 
    <option id="size10">10</option> 
 
    <option id="size11">11</option> 
 
    <option id="size12">12</option> 
 
    <option id="size14">14</option> 
 
    <option id="size18">18</option> 
 
    <option id="size24">24</option> 
 
    <option id="size30">30</option> 
 
    <option id="size36">36</option> 
 
    <option id="size48">48</option> 
 
    <option id="size60">60</option> 
 
    <option id="size72">72</option> 
 
</select> 
 

 
<label id="lbll">fooo</label>

Answer 3

<option id="size6" value="6">6</option> 

изменить все выберите элементы списка как выше

Answer 4

Add "PX" наконец значения см ниже JS -

$("#size").on('change',function(){ 
 
    var getValue=$(this).val(); 
 
    
 
    $("#lbll").css("font-size",getValue + "px"); 
 

 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select name="fontsize" id="size"> 
 
     <option id="size6">6</option> 
 
     <option id="size8">8</option> 
 
     <option id="size9">9</option> 
 
     <option id="size10">10</option> 
 
     <option id="size11">11</option> 
 
     <option id="size12">12</option> 
 
     <option id="size14">14</option> 
 
     <option id="size18">18</option> 
 
     <option id="size24">24</option> 
 
     <option id="size30">30</option> 
 
     <option id="size36">36</option> 
 
     <option id="size48">48</option> 
 
     <option id="size60">60</option> 
 
     <option id="size72">72</option> 
 
    </select> 
 

 
<label id="lbll">fooo</label>

Answer 5

$(document).ready(function(){ 
    $("#size").on('change',function(){ 

     var getValue=$(this).val(); 


     $("#lbll").css("font-size",getValue + 'px'); 

    }); 
}); 

FIDDLE

Вы должны добавить 'точек' в конце вашего размера шрифта.

Answer 6

вы не можете получить доступ к значению, не устанавливая его в настройках, попробуйте заменить этот ..

<select name="fontsize" id="size"> 
     <option value="6px">Size 6</option> 
     <option value="8px">Size 8</option> 
     <option value="9px">Size 9</option> 
     <option value="10px">Size 10</option> 
</select> 
<label id="lbll">fooo</label> 

Здесь рабочий FIDDLE.

Answer 7

Вы должны добавить px в текст быть установлен как CSS, как так:

$("#size").on('change', function() { 
    $("#lbll").css("font-size", $(this).val() + "px"); 
}); 

Here is the JSFiddle demo