Question

我想在用户更改所选值时更改所选值的文本大小。

示例：

一切都很好，但是当我们改成更大的东西时：

您看到文本已从select元素中删除，我不想根据所选值的大小更改所选元素的大小。我想更改所选值的文本大小以适合元素。

有没有办法在javascript中执行此操作？

Answer 1

可能你可以试试这样的东西，但这会使你的页面笨拙，因为字体大小并不是一直都是一致的。

<html>
    <select style="width: 150px;" id="dropdown">
    	<option>Todas</option>
        <option>Sesporte - contrasxyz</option>
        <option>Sesporte - contrasxyz - todas</option>
    </select>
    <script>
    var activity = document.getElementById("dropdown");
    function start(){
    activity.addEventListener("change",addActivityItem,false);
    }

    function addActivityItem(){
          //option is selected
          if (activity.value.length > 10)
          {
          	activity.style.fontSize = "8px";
          }
          else
          {
          	activity.style.fontSize = "16px";
          }
    }

    window.addEventListener("load", start, false);
    </script>
    </html>

但是，您可以删除“select”标记的“样式”，以便该页面自动适合下拉列表中的所有尺寸。

<html>
<select>
	<option>Todas</option>
    <option>Sesporte - contrasxyz</option>
    <option>Sesporte - contrasxyz - todas</option>
</select>
</html>

更改交换中所选值的文本大小

1 个答案: