0

我正在尝试删除文本框的样式或背景以在单击 10 次后显示内容。我怎样才能在 Javascript 上做到这一点？

这是我的html：

<input id="firstN" type="text" style="color:#FF0000; background-color:#FF0000">

这是我的JS：

 function check() {

    var tries++;

    if (tries == 10){
        document.getElementById('firstN').disabled= true;
    }
}
4

4 回答 4

2

问题是这tries是一个局部变量（check函数的局部变量）。每次check调用时，都会创建一个名为的新变量并将tries其初始化为 0。

试试这个：

var tries = 0;
function check() {
  tries++;
  if (tries == 10) {
    document.getElementById('firstN').style.background = '#ffffff';
  }
}

（我假设您在check单击元素时已经有一些代码要调用。如果没有，则需要向元素添加单击处理程序。）

于 2012-12-16T04:58:44.623 回答
1

每次进入此函数时，您都在实例化一个 var“尝试”。将变量向上移动到它将递增的位置：

var btn = document.getElementById("btnclick");
btn.onclick = check;
var tries = 0;
function check() {

    tries++;

    if (tries == 10){
        var ele = document.getElementById("firstN");
        ele.value= "DISABLED";

        ele.disabled = true;
    }
}​

编辑：

工作JSFiddle

于 2012-12-16T04:59:07.947 回答
0

将其存储在 cookie 中：

<script type="text/javascript">var clicks = 0;</script>
<input id="firstN" type="text" style="color:#FF0000; background-color:#FF0000" value="Click" onclick="clicks++">

onclick="$.cookie('clicks', $.cookie('clicks') + 1);"
于 2012-12-16T05:01:44.457 回答
0

干得好。当您看到它有效时删除警告行。

<html>
<head>
    <title>Test</title>

    <script>
 function check(){

    var getClicks = parseInt(document.getElementById('firstN').getAttribute('clicks')); //Get Old value

    document.getElementById('firstN').setAttribute("clicks", 1 + getClicks); //Add 1

    if (getClicks === 10){ //Check
        alert('Locked');
        document.getElementById('firstN').disabled= true;
    } else {
        alert(getClicks); //Remove else statement when you see it works.
    }

}

    </script>
</head>
<body>

<form action="#">
    Input Box: <input id="firstN" type="text" style="color:#FF0000; background-color:#FF0000" onclick="check();" clicks="0">
    <input type="submit" name="Submit" value="Submit">
</form>
</body>
</html>
于 2012-12-16T05:54:12.437 回答