更改按钮文字onclick

当我点击这个按钮时，我想要改变这个值。 HTML：更改按钮文字onclick

<input onclick="change()" type="button" value="Open Curtain" id=myButton1"></input>

的Javascript：现在

function change(); 
{ 
document.getElementById("myButton1").value="Close Curtain"; 
}

的按钮显示打开窗帘，我希望它改变关闭窗帘，这是正确的？

来源

2012-05-20 Anthony Do

如果我正确地理解了您的问题，您希望在“开幕”和“关幕”之间切换 - 如果关闭，则更改为“开幕”，反之亦然。如果这就是你需要的，这将工作。

function change() // no ';' here 
{ 
    if (this.value=="Close Curtain") this.value = "Open Curtain"; 
    else this.value = "Close Curtain"; 
}

请注意，您不需要使用document.getElementById("myButton1")内的变化，因为它是所谓的上下文myButton1 - 我的意思的情况下，你会晚一点知道，阅读有关书籍JS 。

UPDATE：

我错了。不像我之前说的那样，this不会引用元素本身。您可以使用此：

function change() // no ';' here 
{ 
    var elem = document.getElementById("myButton1"); 
    if (elem.value=="Close Curtain") elem.value = "Open Curtain"; 
    else elem.value = "Close Curtain"; 
}

来源

2012-05-20 06:08:00

不能与的 'onClick'，PARTH。你必须传递对象的引用：onClick =“change（this）”，然后在JS：function change（button）{print button.value; } – Sp4cecat

哦，是的......正确的。我认为它会工作，但是当我看到你的评论，我摆弄出来，它失败了...我只是做一个编辑 –

@ParthThakkar铬'这个'确实设置为按钮。 – Alnitak

你缺少的ID开口报价=你必须在函数声明之后分号。另外，输入标签不需要结束标签。

这工作：

<input onclick="change()" type="button" value="Open Curtain" id="myButton1"> 

<script type="text/javascript"> 
function change() 
{ 
document.getElementById("myButton1").value="Close Curtain"; 
} 
</script>

来源

2012-05-20 06:08:23 Sp4cecat

好像有只是一个简单的拼写错误错误：

删除变化（分号后），不应该有任何的函数声明。
在myButton1声明前添加报价。

更正代码：

<input onclick="change()" type="button" value="Open Curtain" id="myButton1" /> 
... 
function change() 
{ 
    document.getElementById("myButton1").value="Close Curtain"; 
}

更快和更简单的解决办法是在您的按钮的代码，并使用此关键字来访问按钮。

<input onclick="this.value='Close Curtain'" type="button" value="Open Curtain" id="myButton1" />

来源

2012-05-20 06:25:12

试试这个，

<input type="button" id="myButton1" value="Open Curtain" onClick="javascript:change(this);"></input> 
<script> 
function change(ref) { 
    ref.value="Close Curtain"; 
} 
</script>

来源

2012-05-20 06:26:22 premcs

你不需要javascript：在一个onClick - 只在一个href =“javascript：” – Sp4cecat

有很多方法。而且这在所有浏览器中都可以工作，并且您不必再使用document.getElementById，因为您将元素本身传递给该函数。

<input type="button" value="Open Curtain" onclick="return change(this);" /> 

<script type="text/javascript"> 
function change(el) 
{ 
    if (el.value === "Open Curtain") 
     el.value = "Close Curtain"; 
    else 
     el.value = "Open Curtain"; 
} 
</script>

来源

2012-05-20 07:26:58 user1865775

-1

This is simple way to change Submit to loading state 

<button id="custSub" type="submit" class="button left tiny" data-text-swap="Processing.. &nbsp;">Submit &nbsp;<i class="fa fa-angle-double-right"></i></button> 


    <script> 
    jQuery(document).ready(function ($) { 

     $("button").on("click", function() { 
      var el = $(this); 
      if (el.html() == el.data("text-swap")) { 
      el.html(el.data("text-original")); 
      } else { 
      el.data("text-original", el.html()); 
      el.html(el.data("text-swap")); 
      } 
      setTimeout(function() { 
       el.html(el.data("text-original")); 
      }, 500); 
     }); 

    }); 
    </script>

来源

2014-07-02 09:06:48

<input type="button" class="btn btn-default" value="click me changtext"    id="myButton1" onClick="changetext()" > 

      <script> 
      function changetext() { 
       var elem = document.getElementById("myButton1"); 
       if (elem.value=="click me change text") 
        { 
         elem.value = "changed text here"; 
        } 
       else 
       { 
        elem.value = "click me change text"; 
       } 
      } 
      </script>

来源

2014-11-10 07:44:03

这可以很容易用VBS代码来完成（因为我不那么熟悉的js）

<input type="button" id="btn" Value="Close" onclick="check"> 
<script Language="VBScript"> 
sub check 
if btn.Value="Close" then btn.Value="Open" 
end sub 
</script>

就大功告成了，但是这改变了名称只显示，不改变功能{onclick}，我做了一些关于如何做第二个的研究，似乎并没有像

btn.onclick = ".."

但我想通了使用<“跨度”办法>标签它是这样的：

<script Language="VBScript"> 
    Sub function1 
    MsgBox "function1" 
    span.InnerHTML= "<Input type=""button"" Value=""button2"" onclick=""function2"">" 
    End Sub 

    Sub function2 
    MsgBox "function2" 
    span.InnerHTML = "<Input type=""button"" Value=""button1"" onclick=""function1"">" 
    End Sub 
    </script> 
    <body> 
    <span id="span" name="span" > 
    <input type="button" Value="button1" onclick="function1"> 
    </span> 
    </body>

自己尝试一下，更改子功能1和子功能2的代码，基本上所有你需要知道要它在JScript是线

span.InnerHTML = "..."

剩下的就是你的代码，你想执行

希望这有助于：d

来源

2015-04-10 11:40:44 SixPackScript

你可以改变<"span">与<"div">或<"p"> ....任何标签，可以让你在里面写一个代码 – SixPackScript

如果不反对或者可能已经在使用jQuery，那么您可以在不使用突发式js的情况下执行此操作。希望能帮助到你。 https://en.wikipedia.org/wiki/Unobtrusive_JavaScript也想参考，https://stackoverflow.com/a/3910750/4812515对此进行讨论。

HTML：

<input type="button" value="Open Curtain" id=myButton1"></input>

的Javascript：

  $('#myButton1').click(function() { 
      var self = this; 
      change(self); 
     }); 

      function change(el) { 
      if (el.value === "Open Curtain") 
      el.value = "Close Curtain"; 
      else 
      el.value = "Open Curtain"; 
      }

来源

2015-09-02 22:17:09 alphapilgrim

<!DOCTYPE html> 
<html> 
    <head> 
     <title>events2</title> 
    </head> 
    <body> 
     <script> 
     function fun() { 
      document.getElementById("but").value = "onclickIChange"; 
     } 
     </script> 
     <form> 
     <input type="button" value="Button" onclick="fun()" id="but" name="but"> 
    </form> 
    </body> 
</html>

来源

2017-10-19 11:41:12

当使用<button>元素（？或其它），设置 '值' 不会改变文本，但innerHTML意志。

var btn = document.getElementById("mybtn"); 
btn.value = 'my value'; // will just add a hidden value 
btn.innerHTML = 'my text';

当打印到控制台：

<button id="mybtn" class="btn btn-primary" onclick="confirm()" value="my value">my text</button>

来源

2018-02-27 09:49:47

更改按钮文字onclick

回答

相关问题