javascript更改按钮的值答案

【问题标题】：javascript change value of buttonjavascript更改按钮的值
【发布时间】：2012-09-24 13:37:07
【问题描述】：

如何更改此按钮的值？我正在看一个教程，但似乎只有 url 发生了变化，而不是按钮。

<form name="form" id="form">
<button name="button" id="button">Click Me!</button>
</form>

<script type="text/javascript">
document.form.button.value=new Date();
</script>

【问题讨论】：

您希望在单击按钮时提交表单吗？如果是这样，这将导致页面刷新，这有点使更改按钮的标签毫无意义。如果您只想在单击按钮时看到按钮的文本发生变化，那么您实际上不需要表单。

标签： javascript html forms

【解决方案1】：

我在您的按钮上添加了一个 onclick 以使用函数更改值。

如果在表单标签中添加onsubmit="return false"，则不会刷新页面。

<form name="form" id="form" onsubmit="return false">
    <button name="button" id="button" onclick="changeValue();" value="before" >Click Me!</button>
</form>

<script type="text/javascript">
    function changeValue()
    {
        // Changes the value of the button
        document.form.button.value = new Date();

        // Changes the text on the button
        document.form.button.innerHTML = new Date();
    }
</script>

【讨论】：

它可以工作，但不会更改按钮文本...它将网址更改为此... www.mywebsite.com/javascript.html?button=Thu+Jan+18+2020+ 14%3A51%3A00+GMT-0400+%28东部+日光+时间%29
@droidus 我编辑了我的帖子，有两个不同的东西，按钮的值和按钮上的文本。我的示例现在两者兼而有之。
它现在更改 url 并在末尾添加“？button=after”
@JonathanPayne 我猜是你，否决了我和“Travesty3”的答案......撤消反对票。你不知道 'droidus' 想要什么：“当用户点击按钮时，按钮内的文本应该改变”（来自 'droidus'）。
啊，我刚刚看到了一些东西......在弹出窗口之后，有一个快速的瞬间，日期/时间出现，然后它很快消失......

【解决方案2】：

document.form.button.innerHTML = new Date();

编辑：

如果您要在单击按钮时使按钮上的文本更改为当前日期，这就是您想要做的：

<script type="text/Javascript">
    function changeLabel()
    {
        document.getElementById('button').innerHTML = new Date();
    }
</script>

<button id="button" onclick="changeLabel()">Click Me!</button>

【讨论】：

window.onload(function(){document.form.button.innerHTML = new Date();});
这些方面的内容怎么样：document.getElementById('button1').innerHTML = '...'
他想改变值，而不是按钮上的文字（innerHTML）
@JonathanPayne：在按钮标签上设置值有什么意义？无论如何，在问题中，抱怨是“似乎只有 url 发生了变化，而不是按钮。”听起来我们需要更多关于期望结果的信息。
@droidus：这应该做同样的事情（假设你的按钮实际上有 ID 'button1' 而不是 'button'）。您想对按钮进行哪些更改。您是在寻找要更改的按钮上的文本还是其他内容？你希望它什么时候改变？当用户点击按钮时？

【解决方案3】：

这确实有效...

onclick="changeValue(this);"

function changeValue(button)
{
    // Changes the value of the button
    button.value = new Date();
}

【讨论】：

【解决方案4】：

使用innerHTML:

document.form1.button1.innerHTML=new Date();

更新： 或者，您可以定义您的按钮，如：

<input name="button" id="button" type="button" value="Click Me!" />

这样的话

document.form.button.value=new Date();

应该如您所愿。

【讨论】：