javascript - 使用 1 个函数更改 span 的值

Question

我正在尝试计算 texbox 中的字符，并使用 java 脚本将该数字放到一个跨度中。我如何使用 1 个 javascript 函数来做到这一点？它们都在一个 php 变量中。

$content="

<script language='JavaScript'>
   function here
</script>

<p><input type='text' name='title' onKeyUp='function()' />
    <br />character count: <span id='titlecharcount'>0</span></p>
<p><input type='text' name='description' onKeyUp='function()' />
    <br />character count: <span id='descriptioncharcount'>0</span></p>
";

Answer 1

如果您更改onKeyUp要传入的属性this以及id跨度的属性，例如（注意引号）：

<input type='text' name='title' onKeyUp="yourHandler(this, 'titlecharcount')" />

...然后在您的处理程序中接受这些参数，第一个将是对input元素的引用，第二个将是给出id跨度的字符串。然后，您可以span通过document.getElementById. 这使您可以获取和设置其innerHTML属性以获取和设置其内容。an 的值input可用作value输入的属性，因此：

function yourHandler(input, id) {
    var span = document.getElementById(id);
    span.innerHTML = input.value.length;
}

---

旁注：我建议使用onkeypress而不是onkeyup. onkeyup仅在释放键时触发，因此当有人按住键并重复键时，您的计数不会更新。

另外，将属性名称全部小写，不要混合大小写（onkeypressnot onKeyPress）。

Answer 2

span 元素没有价值，它们有内部内容。您可以使用此功能更改内容：

function changeLink(elementID)
{
    document.getElementById(elementID).innerHTML="content";
}