{"id":3890,"date":"2023-03-15T22:35:42","date_gmt":"2023-03-15T14:35:42","guid":{"rendered":"https:\/\/resource.webduino.io\/?p=3890"},"modified":"2023-03-15T22:35:42","modified_gmt":"2023-03-15T14:35:42","slug":"button-2","status":"publish","type":"docs","link":"https:\/\/resource.webduino.io\/docs\/socket\/sensor\/button-2","title":{"rendered":"\u96fb\u6d41\u6025\u6025\u68d2"},"content":{"rendered":"

\u4e0a\u4e00\u7bc7\u6211\u5011\u8a8d\u8b58\u4e86\u300c\u958b\u95dc\u300d\uff0c\u4e5f\u53ef\u4ee5\u900f\u904e\u6309\u58d3\u958b\u95dc\u4f86\u95dc\u71c8\uff0c\u4f46\u9019\u6a23\u5b50\u7684\u505a\u6cd5\u548c\u65e5\u5e38\u751f\u6d3b\u4e2d\u7684\u958b\u95dc\u6c92\u5169\u6a23\uff0c\u6240\u4ee5\u5728\u9019\u7bc7\u6559\u5b78\uff0c\u900f\u904e\u540c\u6a23\u7684\u539f\u7406\uff0c\u5be6\u969b\u505a\u51fa\u4e00\u500b\u7c21\u55ae\u7684\u96fb\u6d41\u6025\u6025\u68d2\uff0c\u6216\u662f\u76f4\u63a5\u628a\u73fe\u6210\u7684\u96fb\u6d41\u6025\u6025\u68d2\u73a9\u5177\u62ff\u4f86\u6539\u9020\uff0c\u8b8a\u6210\u548c\u667a\u6167\u63d2\u5ea7\u7d50\u5408\u7684\u667a\u6167\u73a9\u5177\uff01<\/p>\n

\u8a8d\u8b58\u96fb\u6d41\u6025\u6025\u68d2<\/h2>\n

\u96fb\u6d41\u6025\u6025\u68d2\u7684\u539f\u7406\u5176\u5be6\u5c31\u662f\u628a\u300c\u8a0a\u865f\u8173\u300d\u548c\u300c\u6b63\u6975\u300d( VCC \u6216 3.3V ) \u7684\u5ef6\u4f38\u51fa\u4f86\uff0c\u7576\u300c\u5169\u8005\u63a5\u89f8\u7684\u6642\u5019\uff0c\u5c31\u7b49\u540c\u65bc\u6309\u4e0b\u958b\u95dc<\/strong>\u300d\u3002<\/p>\n

\"\u96fb\u6d41\u6025\u6025\u68d2\u539f\u7406\"<\/p>\n

\u6240\u4ee5\u6700\u7c21\u55ae\u7684\u65b9\u6cd5\uff0c\u62ff\u5169\u689d\u675c\u90a6\u7dda\uff0c\u7528\u91dd\u8173\u4e92\u76f8\u78b0\u89f8\uff0c\u5c31\u53ef\u4ee5\u767c\u73fe\u4ecd\u7136\u6709\u548c\u6309\u9215\u958b\u95dc\u4e00\u6a23\u7684\u8a0a\u865f\u53cd\u61c9\uff0c\u9019\u88cf\u5148\u7528 Webduino Blockly<\/a> \u4f86\u6e2c\u8a66\uff0c\u62d6\u62c9\u51fa\u548c\u6309\u9215\u958b\u95dc\u4e00\u6a23\u7684\u908f\u8f2f\uff0c\u89f8\u78b0\u5230\u7684\u6642\u5019\u6703\u6709\u4e0d\u540c\u7684\u6587\u5b57\u986f\u793a\u3002<\/p>\n

\n

\u76f8\u95dc\u6559\u5b78\uff1a\u6309\u9215\u958b\u95dc<\/a><\/p>\n

\n

\u7bc4\u4f8b\u89e3\u7b54 ( \u9ad4\u9a57\u7248 )\uff1ahttps:\/\/goo.gl\/1cDKM4<\/a><\/p>\n<\/blockquote>\n

\"\u8a2d\u5b9a\u6309\u9215\u958b\u95dc\u7a4d\u6728\"<\/p>\n

\u78ba\u5b9a\u958b\u767c\u677f\u4e0a\u7dda\uff0c\u57f7\u884c\u4e4b\u5f8c\u628a\u5169\u689d\u675c\u90a6\u7dda\u4e92\u76f8\u89f8\u78b0\uff0c\u5c31\u6703\u770b\u5230\u6587\u5b57\u767c\u751f\u8b8a\u5316\u3002<\/p>\n

\"\u5229\u7528\u675c\u90a6\u7dda\u6a21\u64ec\u6309\u9215\u958b\u95dc\u72c0\u614b\"<\/p>\n

\u5982\u679c\u628a\u5176\u4e2d\u4e00\u500b\u91dd\u8173\u5229\u7528\u9435\u7d72\u6216\u9435\u7247\u5ef6\u9577\uff0c\u5c31\u53ef\u4ee5\u505a\u51fa\u985e\u4f3c\u96fb\u6d41\u6025\u6025\u68d2\u7684\u8ecc\u9053\u611f\u89ba\u3002<\/p>\n

\"\u5229\u7528\u9435\u7d72\u505a\u51fa\u96fb\u6d41\u6025\u6025\u68d2\u8ecc\u9053\"<\/p>\n

\u70ba\u4e86\u8b93\u96fb\u6d41\u6025\u6025\u68d2\u66f4\u6709\u73a9\u5177\u7684\u611f\u89ba\uff0c\u9019\u908a\u7528\u4e00\u500b 79 \u5143\u7684\u96fb\u6d41\u6025\u6025\u68d2\u73a9\u5177\u4f86\u6539\u9020\u3002<\/p>\n

\"\u5e02\u552e\u96fb\u6d41\u6025\u6025\u68d2\u73a9\u5177\"<\/p>\n

\u62c6\u958b\u5916\u6bbc\u4e4b\u5f8c\u5167\u5bb9\u5c31\u662f\u4e00\u584a\u9435\u7247 ( \u8ecc\u9053 ) \u52a0\u4e0a\u5f88\u7c21\u55ae\u7684\u96fb\u8def\uff0c\u628a\u4e00\u689d\u675c\u90a6\u7dda\u526a\u65b7\u525d\u76ae\uff0c\u9732\u51fa\u9285\u7dda\uff0c\u900f\u904e\u6587\u5177\u7684\u5e97\u9ecf\u571f\u9ecf\u5728\u9435\u7247\u4e0a\u4f5c\u70ba\u8a0a\u865f\u8173\u4f7f\u7528\u3002<\/p>\n

\"\u6539\u9020\u5e02\u552e\u96fb\u6d41\u6025\u6025\u68d2\u73a9\u5177\"<\/p>\n

\u53e6\u5916\u628a\u8981\u73a9\u96fb\u6d41\u6025\u6025\u68d2\u7684\u9435\u7d72\u6216\u5c0f\u91d1\u5c6c\u68d2\uff0c\u63a5\u5728 VCC \u6216 3.3V \u4e0a\u982d\uff0c\u6700\u5f8c\u7d44\u88dd\u63a5\u7dda\u8d77\u4f86\u5c31\u662f\u8981\u64cd\u63a7\u7684\u300c\u667a\u6167\u300d\u96fb\u6d41\u6025\u6025\u68d2\u4e86\u3002<\/p>\n

\"\u5c07\u96fb\u6d41\u6025\u6025\u68d2\u73a9\u5177\u63a5\u4e0a\u99ac\u514b\u4e00\u865f\"<\/p>\n

\u7db2\u9801\u63a7\u5236<\/h2>\n

\u77e5\u9053\u539f\u7406\u4e4b\u5f8c\u5c31\u6e96\u5099\u4f86\u5beb\u7a0b\u5f0f\uff0c\u7528\u4e00\u584a\u958b\u767c\u677f\u7576\u4f5c\u96fb\u6d41\u6025\u6025\u68d2\uff0c\u53e6\u5916\u4e00\u584a\u958b\u767c\u677f\u63a7\u5236\u96fb\u71c8<\/strong>\u3002 ( \u5176\u5be6\u4e0d\u4e00\u5b9a\u8981\u9019\u6a23\u505a\uff0c\u4e5f\u662f\u53ef\u4ee5\u7528\u540c\u4e00\u584a\u958b\u767c\u677f\u5b8c\u6210\uff0c\u53ea\u662f\u7528\u5169\u584a\u66f4\u80fd\u51f8\u986f\u300cWi-Fi\u300d\u64cd\u63a7\u7684\u80fd\u529b )<\/p>\n

HTML \u7684\u90e8\u5206\u5148\u5728\u81ea\u5df1\u7684\u7db2\u9801\u5167\u5f15\u5165\u300c webduino-min.js \u300d\u9084\u6709\u300c webduino-blockly.js \u300d\u9019\u5169\u500b JavaScript\uff0c\u9019\u6a23\u6211\u5011\u624d\u6709\u64cd\u63a7\u958b\u767c\u677f\u4ee5\u53ca\u96fb\u6d41\u6025\u6025\u68d2\u7684 API \u53ef\u4ee5\u4f7f\u7528\uff0c\u5728 body<\/code> \u7684\u5340\u57df\u653e\u5165\u4e00\u500b h2<\/code> \u4f86\u986f\u793a\u4e00\u4e9b\u6587\u5b57\u8a0a\u606f\uff0c\u7136\u5f8c\u653e\u5165\u5169\u5f35\u71c8\u6ce1\u4e00\u660e\u4e00\u6697\u7684\u5716\u7247\uff0c\u8b93\u5075\u6e2c\u5230\u8a0a\u865f\u7684\u6642\u5019\uff0c\u7db2\u9801\u4e0a\u7684\u71c8\u6ce1\u4e5f\u6703\u767c\u751f\u53cd\u61c9\u3002<\/p>\n

<html>\n<head>\n  <meta charset=\"utf-8\">\n  <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no\">\n  <title>Webduino<\/title>\n  <script src=\"https:\/\/ajax.googleapis.com\/ajax\/libs\/jquery\/1.9.1\/jquery.min.js\"><\/script>\n  <script src=\"https:\/\/webduino.io\/components\/webduino-js\/dist\/webduino-all.min.js\"><\/script>\n  <script src=\"https:\/\/blockly.webduino.io\/webduino-blockly.js\"><\/script>\n<\/head>\n\n<body>\n  <h2 id=\"show\"><\/h2>\n  <img src=\"http:\/\/example.oxxostudio.tw\/it2016\/it2016-day05-on.webp\" id=\"on\">\n  <img src=\"http:\/\/example.oxxostudio.tw\/it2016\/it2016-day05-off.webp\" class=\"show\" id=\"off\">\n<\/body>\n<\/html>\n<\/code><\/pre>\n
CSS \u7684\u90e8\u5206\u5c31\u53ea\u662f\u5beb\u500b\u7c21\u55ae\u7684\u63a7\u5236\u71c8\u6ce1\u5716\u7247\u6709\u6c92\u6709\u51fa\u73fe\u800c\u5df2\u3002<\/p>\n
img{\n  display:none;\n}\n.show{\n  display:block;\n}\n<\/code><\/pre>\n
JavaScript \u7684\u8aaa\u660e\u5c31\u76f4\u63a5\u5beb\u5728\u7a0b\u5f0f\u78bc\u88e1\u982d\uff0c\u9664\u4e86\u4e00\u958b\u59cb\u7684 a \u8b8a\u6578\u505a\u70ba\u78ba\u8a8d\u5169\u584a\u958b\u767c\u677f\u540c\u6642\u4e0a\u7dda\u5916\uff0c\u591a\u4e86\u4e00\u500b\u8b8a\u6578 b \u505a\u70ba\u5224\u65b7\u89f8\u78b0\u5e7e\u6b21\u4f7f\u7528\uff0c\u7136\u5f8c c \u7684\u9663\u5217\u4f5c\u7528\u5728\u65bc\u5224\u65b7\u300c\u4e00\u79d2\u5167\u7684\u63a5\u89f8\u90fd\u7576\u4f5c\u4e00\u6b21<\/strong>\u300d( \u56e0\u70ba\u5e38\u5e38\u6703\u6709\u63a5\u89f8\u5230\u4e4b\u5f8c\u624b\u7684\u6296\u52d5\u53c8\u9023\u7e8c\u78b0\u89f8\u4e86 )\u3002<\/p>\n
\u7136\u5f8c\u5728\u89f8\u78b0\u7b2c\u4e09\u6b21\u7684\u6642\u5019\uff0c\u57f7\u884c gameOver<\/code> \u7684\u6d41\u7a0b\uff0c\u88e1\u9762\u5c31\u662f\u8b93\u71c8\u9583\u720d\uff0c\u4e09\u79d2\u4e4b\u5f8c\u56de\u6b78\u521d\u59cb\u503c\uff0c\u9019\u6a23\u5c31\u53ef\u4ee5\u7e7c\u7e8c\u904a\u6232\u4e86\u3002<\/p>\n
$(function(){\n\n  var button,\n      led,\n      $show=$('#show'),\n      $on = $('#on'),\n      $off = $('#off'),\n      a = 0,\n      b = 0,\n      c = [-1,-1];\n\n  \/\/\u8a2d\u5b9a\u7b2c\u4e00\u584a\u88dd\u7f6e\u63a5\u667a\u6167\u63d2\u5ea7\u71c8\u6ce1\n  boardReady('\u88dd\u7f6e 1 \u7684 ID', function (board) {\n    board.systemReset();\n    board.samplingInterval = 250;\n    led = getLed(board, 10); \/\/\u8a2d\u5b9a LED \u70ba 10 \u865f\u8173\n    a = a+1;\n    if(a===2){\n      allReady(); \/\/\u78ba\u8a8d\u5169\u584a\u677f\u5b50\u90fd\u4e0a\u7dda\u4e86\u5c31\u57f7\u884c\n    }\n  });\n\n  \/\/\u8a2d\u5b9a\u7b2c\u4e8c\u584a\u88dd\u7f6e\u63a5\u6309\u9215\u958b\u95dc\n  boardReady('\u88dd\u7f6e 2 \u7684 ID', function (board) {\n    board.systemReset();\n    board.samplingInterval = 250;\n    button = getButton(board, 10); \/\/\u8a2d\u5b9a \u6309\u9215\u958b\u95dc \u70ba 10 \u865f\u8173\n    a = a+1;\n    if(a===2){\n      allReady(); \/\/\u78ba\u8a8d\u5169\u584a\u677f\u5b50\u90fd\u4e0a\u7dda\u4e86\u5c31\u57f7\u884c\n    }\n  });\n\n  \/\/\/\/\u78ba\u8a8d\u5169\u584a\u677f\u5b50\u90fd\u4e0a\u7dda\u4e86\u8981\u57f7\u884c\u7684\u52d5\u4f5c\n  function allReady(){\n    $show.text('\u904a\u6232\u958b\u59cb...');\n    button.on(\"pressed\", function(){\n      var varTime = new Date();\n      c[0] = c[1];\n      c[1] = varTime.getSeconds();\n      console.log(c);\n      \/\/\u907f\u514d\u4e00\u79d2\u5167\u6296\u52d5\u78b0\u5230\u7684\u5168\u90fd\u8a08\u7b97\u4e86(\u4e00\u79d2\u5167\u78b0\u5230\u7684\u90fd\u53ea\u7b97\u4e00\u6b21)\n      if(c[0]!=c[1]){\n        b = b + 1;\n        $show.text('\u78b0\u5230 '+ b +' \u6b21\u4e86\uff01');\n        if( b >= 3){\n          gameOver(); \/\/\u78b0\u5230\u4e09\u6b21\u89f8\u767c\u8f38\u6389\u7684\u6d41\u7a0b\n        }\n      }\n    });\n  }\n\n  \/\/\u8a2d\u5b9a\u8f38\u6389\u7684\u4e8b\u4ef6\n  function gameOver(){\n    $show.text('\u4f60\u8f38\u5566\u5566\u5566\u5566\u5566\u5566\u5566\u5566\uff01');\n    led.blink(500);\n    $on.addClass('show');\n    $off.removeClass('show');\n    \/\/\u9583\u71c8\u4e09\u79d2\u4e4b\u5f8c\uff0c\u56de\u6b78\u521d\u59cb\u8a2d\u5b9a\uff0c\u7e7c\u7e8c\u904a\u6232\n    setTimeout(function(){\n      led.off();\n      $show.text('\u91cd\u65b0\u958b\u59cb...');\n      $on.removeClass('show');\n      $off.addClass('show');\n      b = 0;\n      c = [-1,-1];\n    },3000);\n  }\n\n});\n<\/code><\/pre>\n
\u7db2\u9801\u57f7\u884c\u4e4b\u5f8c\uff0c\u53ef\u4ee5\u770b\u5230\u5982\u679c\u8655\u78b0\u4e09\u6b21\uff0c\u5c31\u6703\u89f8\u767c\u71c8\u6ce1\u8207\u7db2\u9801\u5c0d\u61c9\u7684\u52d5\u4f5c ( \u4e5f\u5c31\u662f\u8f38\u6389\u7684\u52d5\u4f5c )\u3002<\/p>\n
\"\u96fb\u6d41\u6025\u6025\u68d2\u642d\u914d\u667a\u6167\u63d2\u5ea7\"<\/p>\n
\u4e5f\u53ef\u4ee5\u5728\u51fa\u53e3\u7684\u5730\u65b9\u591a\u4e00\u500b\u6309\u9215\u958b\u95dc\u505a\u70ba\u904e\u95dc\u7684\u63a5\u89f8\u4f7f\u7528\uff0c\u63a5\u7dda\u5716\u53ef\u4ee5\u53c3\u8003\u4e0b\u65b9\uff1a<\/p>\n
\"\u96fb\u6d41\u6025\u6025\u68d2\u642d\u914d\u667a\u6167\u63d2\u5ea7\u63a5\u7dda\u5716\"<\/p>\n
\u7a0b\u5f0f\u78bc\u7684\u90e8\u5206\u53ea\u8981\u5728 JavaScript \u4e00\u958b\u59cb\u591a\u5ba3\u544a\u4e00\u500b\u6309\u9215\u8b8a\u6578\uff0c\u7136\u5f8c\u591a\u65b0\u589e\u4e00\u500b\u904e\u95dc\u7684\u6307\u4ee4\u5373\u53ef\u3002<\/p>\n
    button2.on(\"pressed\", function(){\n      youWin();\n    });\n\n  \/\/\u8a2d\u5b9a\u904e\u95dc\u4e8b\u4ef6\n  function youWin(){\n    $show.text('\u606d\u559c\u904e\u95dc\uff01\uff01\uff01\uff01\uff01\uff01\uff01\uff01');\n    led.on();\n    $on.addClass('show');\n    $off.removeClass('show');\n    \/\/\u4e09\u79d2\u4e4b\u5f8c\uff0c\u56de\u6b78\u521d\u59cb\u8a2d\u5b9a\uff0c\u7e7c\u7e8c\u904a\u6232\n    setTimeout(function(){\n      led.off();\n      $show.text('\u91cd\u65b0\u958b\u59cb...');\n      $on.removeClass('show');\n      $off.addClass('show');\n      b = 0;\n      c = [-1,-1];\n    },3000);\n  }\n\n});\n<\/code><\/pre>\n
\u4ee5\u524d\u6709\u505a\u904e\u4e00\u500b\u985e\u4f3c\u7684\uff0c\u53ef\u4ee5\u53c3\u8003\u9019\u500b\u5f71\u7247\uff1a<\/p>\n