个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
25
4
我正在尝试实现以下内容以根据按钮点击增加文本大小。我正在尝试为此使用一个处理程序。这个想法是将“演示”区域中文本的字体大小增加/减少 +/-5 像素。但是我没有得到想要的结果。
<html>
<body>
<p>Change font size</p>
<div id="main_area1">
<button id="button1" value="larger" type="button" onclick="changeFontSize(this)">Larger</button>
</div>
<div id="main_area2">
<button id="button2" vale="smaller" type="button" onclick="changeFontSize(this)">Smaller</button>
</div>
<div>
<p id="demo">HOW_BIG_OR_SMALL_AM_I</p>
</div>
<script>
function changeFontSize(target) {
if (target == document.getElementById("button1")) {
document.getElementById("demo").style.fontSize = document.getElementById("demo").style.fontSize + "5px";
} else if (target == document.getElementById("button2")) {
document.getElementById("demo").style.fontSize = document.getElementById("demo").style.fontSize + "-5px";
}
}
</script>
</body>
</html>当我在开发人员控制台中检查它时，我看到我的目标与 button1 具有相同的 value。但是我看不到字体大小在增加(button2 也是如此)。
我尝试尽可能多地使用我的 Java 知识，但没有取得任何进展。我想我可能使用了错误的元素 ID，或者我没有正确注册处理程序。
感谢任何帮助或善意的建议!谢谢。
最佳答案
几点:
style 对象不会有通过样式表应用的值；要获得这些，您可以在符合标准的浏览器上使用 getComputedStyle。 (在旧版 IE 上，您使用 currentStyle 属性。)
你需要解析你得到的值，因为它是一个字符串。
每当您发现自己一遍又一遍地重复写同一件事时，请考虑是否只做一次并将其记住在一个变量中。
这在符合标准的浏览器上有效并且应该也适用于旧的 IE:
function changeFontSize(target) {
var demo = document.getElementById("demo");
var computedStyle = window.getComputedStyle
? getComputedStyle(demo) // Standards
: demo.currentStyle; // Old IE
var fontSize;
if (computedStyle) { // This will be true on nearly all browsers
fontSize = parseFloat(computedStyle && computedStyle.fontSize);
if (target == document.getElementById("button1")) {
fontSize += 5;
} else if (target == document.getElementById("button2")) {
fontSize -= 5;
}
demo.style.fontSize = fontSize + "px";
}
}<p>Change font size</p>
<div id="main_area1">
<button id="button1" value="larger" type="button" onclick="changeFontSize(this)">Larger</button>
</div>
<div id="main_area2">
<button id="button2" vale="smaller" type="button" onclick="changeFontSize(this)">Smaller</button>
</div>
<div>
<p id="demo">HOW_BIG_OR_SMALL_AM_I</p>
</div>关于JavaScript onclick() 文本大小随 EventListener 增加，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/26652595/
25
4
0
我想要完成的是一段代码，当单击其中一个按钮时，该按钮将获得下面列出的样式，而所有其他按钮样式将返回 null。 我假设它涉及一个 bool 语句，但也许我错了。 您将在下面看到我试图使用我的“else
我在我的 javascript 文件中的 for 循环中创建了一堆 div。它们具有相同的类名但不同的 ID。 我通过 for 循环添加了一个事件监听器，但我之前的分配被覆盖了，现在所有的 div 都
我为一些 创建了一个 EventListener元素，现在我想更改此特定元素的子元素的不透明度，以更改此特定元素上的 EventListener 是否为真。我如何用 jQuery 或 Javascr
我正在尝试删除一个 eventListener，但看起来我错过了什么。 为什么下面的代码不起作用，它没有从按钮中删除事件监听器。 我也试过绑定(bind)这个来传递作用域，但是也没用 class Te
我想在一个类中处理多个事件，这是我的示例: @Lazy(false) @Component public class EventListenerImpl { @EventListener
在我的应用程序中，我有“用户”。一个用户可以有多个“账户” 我的“帐户”实体上有一个监听器。它在“service.yml”文件中声明如下: account_listener: class: A
我想在我的项目中使用 CQRS 模式的元素。我想知道我是否用命令和事件做对了。 我不确定的是事件是否可以调用命令。为了更好地展示我想要做什么，我将使用图表和示例。 这是一个例子: 用户调用 TripC
所以当我点击“hartje”部分时，我正在触发一个功能。该函数正在获取名称为“food-option”的所有类。如果我点击函数触发器，它应该给“数据最喜欢的”一个值。它确实给了它一个值，但问题是我必须
我试图理解这段代码，但它没有任何意义。当点击#open_help按钮时，他正在调用handleOpen()，它调用showHelp()，它调用jQuery函数来显示帮助div，但如果您在下面看到他正在
使用 JavaScript 创建表格时，我正在尝试在循环中设置事件监听器。每次迭代中的事件监听器应调用相同的函数，但以当前索引作为参数。我在这里发现我可以将闭包与函数数组一起使用，但我必须使用数组吗？
这个问题已经有答案了: Javascript infamous Loop issue? [duplicate] (5 个回答) 已关闭 7 年前。 http://jsfiddle.net/1wqdmo
我调用一个函数，其中包含“if/else”语句，该函数根据作为参数传递的 bool 值添加或删除监听器。 我的问题是我无法通过调用相同的函数来删除先前添加的监听器 我缺少什么？ function li
我正在尝试学习 HTML5 Canvas 。在出现吃 cookies 的猫 gif 之前，第一张图片需要点击七次。最初，我将 click EventListener 绑定(bind)到图像。出现吃 c
我很喜欢普通的 JS 井字游戏每个单元格都是一个按钮。为了处理点击，我将 eventListener 添加到包装 div: board.addEventListener("click", handle
我正在寻找一种简洁明了的方法来向我的每个复选框添加事件监听器，而不必重复我的 Javascript 代码，当涉及到 JS 时，我仍然不知所措，所以任何帮助都会非常有用赞赏。 这是我目前所拥有的
大家好。有人知道我们使用 addEventListener 方法时事件存储在哪里吗？？？示例: window.addEventListener('mousedown', this.myvar.onCl
有没有一种方法可以将事件监听器添加到输入，其中焦点从 onfocus 变为 off focus 基本上我使用 key up 为我的输入框分配了一个事件监听器，然后调用我的服务器来检查用户名是否已经在数
我正在 try catch 表单的 invalid 事件，但它似乎没有发生？ https://codepen.io/MartinMuzatko/pen/VzWwxG?editors=1010 对于我的
我试图在单击 Canvas 元素时删除 eventListener: document.getElementById("canvas") .addEventListener("clic
我使用这行代码向通过 forloop 创建的 div 添加事件监听器: for(var i in mail){ //create div parent.addEventListener("
我是一名优秀的程序员,十分优秀！