0

我对编码相当陌生，并且正在尝试学习制作 Chrome 插件以向网站添加一些功能。我一直在努力寻找这个问题的答案，并搜索并提出了很多不同的选择，但我无法弄清楚我所追求的东西。

我正在寻找的是一个脚本，它允许我计算 5 个不同按钮的点击次数，然后通过“提交”按钮将它们发送到文本区域。

[A] [B] [C] [D] [E] [发送]

因此，如果我要单击按钮 A 两次、C 一次和 E 三次，然后单击“发送”，它会将其发送到我的 textarea，它会显示“Counted A2 C1 E3”并忽略任何未单击的内容。作为奖励，当文本发送到 textarea 时，它是否有可能自动提交？

希望这是有道理的，我期待着我能得到的任何帮助。

问候， 帕津加

4

3 回答 3

1

这段代码更好，你可以有尽可能多的按钮！

更新：修复键未排序的错误（例如：Counted E3 C1 A2）

<html>
<head>  
<script>
    var list = {};
    function increaseCounter(variable) {
        if(!list[variable])
            list[variable]=1;
        else
            list[variable]++;
    }
    function send() {
        var keys = [];
        for(x in list)
            keys.push([x,list[x]]);
        keys.sort();

        var s = "Counted", i;
        for( i = 0; i < keys.length; i++)
            s += " " + keys[i][0] + keys[i][1];
        document.getElementById('textarea').value = s;
    }
</script>
</head>
<body>
<textarea id="textarea"></textarea>

<button onclick="increaseCounter('A')">A</button>
<button onclick="increaseCounter('B')">B</button>
<button onclick="increaseCounter('C')">C</button>
<button onclick="increaseCounter('D')">D</button>
<button onclick="increaseCounter('E')">E</button>

<button onclick="send()">Send</button>
</body>
</html>
于 2013-04-20T12:05:39.553 回答
1

你可以在这里找到一个可能的解决方案：http: //jsfiddle.net/jrm2k6/gv8vZ/

您可以在方便时对其进行修改。

这是使用的html：

<button type="button" id="a">A</button>
<button type="button" id="b">B</button>
<button type="button" id="c">C</button>
<button type="button" id="d">D</button>
<button type="button" id="e">E</button>
<textarea rows="5" cols="40" id="results">
</textarea>

还有js部分：

var buttonClicked = {"a":0, "b":0, "c":0, "d":0, "e":0};

$("button").click(function() {
  $("#results").text('');
  var clickedId = $(this).attr('id');
  buttonClicked[clickedId] +=1
  displayCounter();
});

function displayCounter()
{

    for(var elem in buttonClicked)
    {
        if (buttonClicked[elem] != 0)
        {
            $("#results").append(elem + " clicked " + buttonClicked[elem] + "\n");
        }
    }
}

编辑：这很好用，但TNW提供了另一种更通用的方法，这里是小提琴http://jsfiddle.net/xRMRP/

于 2013-04-20T12:05:43.677 回答
0

试试下面的代码，它会帮助你：

<html>
<head>  

 <script>


  var A = 0;
    var B = 0;
    var C = 0;
    var D = 0;
    var E = 0;

    function increaseCounter(variable) {
        switch (variable) {
            case 'A':
                A++;
                break;
            case 'B':
                B++;
                break;
            case 'C':
                C++;
                break;
            case 'D':
                D++;
                break;
            case 'E':
                E++;
                break;
        }
    }


    function send() {

        var text='Counted ';
        if(A>0){
            text+=' A'+A;
        }
        if(B>0){
            text+=' B'+B;
        }
        if(C>0){
            text+=' C'+C;
        }
        if(D>0){
            text+=' D'+D;
        }
        if(E>0){
            text+=' E'+E;
        }
        document.getElementById('textarea').value =text;
    }
</script>
</head>
<body>
<textarea id="textarea"></textarea>

<button onclick="increaseCounter('A')">A</button>
<button onclick="increaseCounter('B')">B</button>
<button onclick="increaseCounter('C')">C</button>
<button onclick="increaseCounter('D')">D</button>
<button onclick="increaseCounter('E')">E</button>

<button onclick="send()">Send</button>
</body>
</html>
于 2013-04-20T11:51:28.637 回答