【问题标题】:Checkbox to change textdecoration input field用于更改 textdecoration 输入字段的复选框
【发布时间】:2010-12-06 16:51:55
【问题描述】:

使用 javascript,我希望我的复选框更改输入文本字段的文本装饰。 因此,当它被选中时,输入文本字段中的文本变为粗体。

记住我正在学习,所以我不像你们那样是专业人士;)

我是这么想的;

var checkbox = create("input");
    checkbox.type = "checkbox";
    checkbox.id = "checkboxId" + counter;
    div.appendChild(checkbox);
    checkbox.onClick="boldChange(this)"

var input = create("input");
    input.type = "input";
    input.id = "inputId" + counter;
    div.appendChild(input);



function boldChange()
var boldgroup = document.getElementsByName(el.name);
for (var b=0; boldgroup[b]; ++b)
inputId.style.textDecoration = boldgroup[b].checked ? 'bold' : 'none';
}

我怎样才能做到这一点? 提前非常感谢您

【问题讨论】:

  • text-decoration: bold 不是有效的 CSS,IIRC

标签: javascript checkbox checked text-decorations


【解决方案1】:

这是一个基于上述代码的有效 JSFiddle 示例:Link to example

代码sn-p:(放在</body>下面,这样所有的DOM都加载好了)

<script>
    var div = document.getElementById('div'),
    counter = 0;

    var checkbox = document.createElement("input");
    checkbox.type = "checkbox";
    checkbox.id = "checkboxId" + counter;
    div.appendChild(checkbox);
    checkbox.onclick = boldChange;
    counter++;

    var input = document.createElement("input");
    input.type = "text";
    input.id = "inputId" + counter;
    div.appendChild(input);



    function boldChange() {
        input.style.fontWeight = (checkbox.checked)?'bold':'normal';
    }
</script>

【讨论】:

  • @Opoe:你肯定是在正确的轨道上,只需要对你的代码做一些调整:)
猜你喜欢
  • 2018-08-27
  • 2021-10-22
  • 2019-10-05
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2013-04-24
相关资源
最近更新 更多