通过单击JavaScript更改按钮文本

时间:2015-08-29 05:06:28

标签: javascript html jsp

我在JSP页面中使用以下代码。这是我通过JavaScript中的按钮单击更改按钮文本的功能。

    <script>
    function click(){
        var el=document.getElementById(btnaccept);
        if(el.value=="Accept"){
           el.value==="Accepted"; 
        }else{
            el.value==="Accept";
        }
    } 
 </script>

这是我的按钮;

<button type="button" class="btn btn-default btn-sm" id="btnaccept"  onclick="click()">
                <span class="glyphicon glyphicon-ok" aria-hidden="true" name="accept"></span> Accept
      </button>

单击&#34;接受&#34;此代码无效。按钮。我在这做了什么错误?

5 个答案:

答案 0 :(得分:3)

试试此代码

<script>
      function click1() {
        var el = document.getElementById('btnaccept');
        //alert(el.innerHTML);
        if (el.textContent == "Accept") {
          el.textContent = "Accepted";
        } else {
          el.textContent = "Accept";
        }
      }
    </script>

将onclick事件更改为click1()

答案 1 :(得分:2)

一些事情:

  • 请勿将您的功能click命名为无效。
  • 您没有在按钮上使用值,而是使用内部HTML。
  • 如果您想要操纵值,请使用,或者如果您想要反过来操纵ineerHTML。
  • document.getElementById将字符串作为参数,因此您要在那里写document.getElementById('btnaccept');
  • 使用=分配值===是比较(等值或类型)

See working demo

答案 2 :(得分:2)

首先,您应该使用>>> integers(min_value=0, max_value=10).flatmap(lambda n: lists(lists(integers(), min_size=n, max_size=n))).example() [[1957906, -3927073, 1876867, 492990922734139702838975287237616327198, 492990922734140672665065292763226913988, 4186129, 635696, 735953], [977765, 662451, 2759000, 492990922734140711822396894681675189101, 492990922734140140158168324233263255663, 502143, 492990922734141746996796422812724739185, 3227613], [191664, 1300515, 6482528, 319283, 492990922734139897662167042663997531115, -226596, 1857994, -2393348], [492990922734140767301167355759734660951, 492990922734141461616337923400083108003, 1468992, 102685, 4244493, 1977953, 492990922734139734438833331715382851781, 492990922734140941311965044331252036070], [492990922734141430613716803754769814902, 1164764, 792352, 6460430, 3863822, 417933, 1028367, 432653], [2746989, 492990922734141389068775096311538140111, 4793474, 3268143, 492990922734141844525243524499904826155, 492990922734141432975588324538413774052, 623043, 492990922734141596377315916430022252257], [9504628, 1439524, 1326537, -538366, 17202268, 6657340, -193066, 492990922734140889793117657227743959252], [4746341, -6393188, -7151787, 493297, 3660059, 409056, 3637009, 4590205], [24937195, 16772388, 743193, 984896, 492990922734141467947711670459172987084, 12441478, 3305605, 492990922734140542336176512792898536606], [492990922734141613464414328216081125830, 575678, 506603, 8455965, 1364227, 7266247, 492990922734141353198805511032911152831, -1599128], [492990922734141428921575729841494299316, 3389901, 5125705, 492990922734141764000051227681110176844, -1307326, 492990922734141167074970978157562738862, 492990922734141148113320874830396899884, 8909536]] >>> 作为函数名称使用任何其他名称。 它会将其视为mouseevent docs

click用于比较以分配值使用===

此处我使用=代替clickbutton()作为函数名称。

<强> HTML

click()

<强>脚本

<button type="button" class="btn btn-default btn-sm" id="btnaccept"  onclick="clickbutton()">

Demo here

答案 3 :(得分:1)

正如mattt所说,在分配值时,需要使用赋值运算符=而不是等于运算符===。此外,使用getElementById时,它会期待一个字符串,因此您要使用getElementById("btnaccept");

同样,要设置按钮元素的文本,我相信您需要使用el.innerText = "Accept";

答案 4 :(得分:0)

我通过以下方式为可压缩面板实现了一个切换按钮:

<button type="button" class="btn btn-default" onclick="changeIcon(this)">
<span class="glyphicon glyphicon-triangle-bottom"></span>
</button>

<script>
function changeIcon(button) {

    if(button.firstElementChild.getAttribute("class") == "glyphicon glyphicon-triangle-bottom")
    {
        button.firstElementChild.setAttribute("class", "glyphicon glyphicon-triangle-top");
    }
    else
    {
        button.firstElementChild.setAttribute("class", "glyphicon glyphicon-triangle-bottom");
    }
}
</script>
相关问题