Question

我想调整font-size中div文本的大小。我知道JavaScript代码，但这里我想要的只是调整具有焦点或当前div的font-size用户已选择div。

$("#slider").on("change",function(){
    var v=$(this).val();
    $('.text').css('font-size', v + 'px');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="range" min="12" max="120" id="slider" />
<div class="text"  contenteditable="true"  style="cursor:grab;">hello</div>
<div class="text text1"  contenteditable="true" style="cursor:grab;">hello</div>
<div class="text text2"  contenteditable="true"  style="cursor:grab;">hello</div>
<div class="text text3"  contenteditable="true"  style="cursor:grab;">hello</div>

怎么做？

Answer 1

将此代码添加到脚本标记

中

$('.text').on('focus',function(){
    $('.text').removeClass('active');
    $(this).addClass('active');
})

并将滑块onChange功能更改为此

$("#slider").on("change",function(){
   var v=$(this).val();
   $('.text.active').css('font-size', v + 'px');
});

在这里你可以看到它是如何工作的： https://jsfiddle.net/Lwy4oge8/

Answer 2

我不熟悉jquery。这是一个有效的javascript代码。

         var focused = null;[].map.call(document.querySelectorAll(".text"),
    function (x) {
        x.onfocus = function () { focused = this;};
    });
    document.querySelector("#slider").onchange = function () {
        focused != null ? focused.style.fontSize = this.value + "px" : true;;

在jquery中调整所选文本的字体大小

2 个答案: