{"id":2936,"date":"2016-11-24T10:22:47","date_gmt":"2016-11-24T02:22:47","guid":{"rendered":"http:\/\/www.menglanglang.cn\/?p=2936"},"modified":"2016-11-24T10:22:47","modified_gmt":"2016-11-24T02:22:47","slug":"html%e4%b8%ad%e5%8f%af%e4%bb%a5%e8%87%aa%e5%ae%9a%e4%b9%89%e8%be%93%e5%85%a5%e7%9a%84select%e4%b8%8b%e6%8b%89%e5%88%97%e8%a1%a8","status":"publish","type":"post","link":"http:\/\/www.menglanglang.cn\/?p=2936","title":{"rendered":"html\u4e2d\u53ef\u4ee5\u81ea\u5b9a\u4e49\u8f93\u5165\u7684select\u4e0b\u62c9\u5217\u8868"},"content":{"rendered":"

\u5728\u9879\u76ee\u5f00\u53d1\u4e2d\uff0c\u5f80\u5f80\u6709\u8fd9\u79cd\u9700\u6c42\uff1a\u90a3\u5c31\u662f\u9700\u8981\u4e0b\u62c9\u9009\u62e9\u5df2\u6709\u7684\u6570\u636e\u5217\u8868\uff0c\u5f53\u6ca1\u6709\u81ea\u5df1\u9700\u8981\u7684\u6570\u636e\u65f6\uff0c\u5f80\u5f80\u9700\u8981\u53bb\u7ba1\u7406\u8fd9\u4e9b\u5217\u8868\u6570\u636e\u7684\u753b\u9762\u53bb\u6dfb\u52a0\uff0c\u6216\u8005\u5728\u4e0b\u62c9\u5217\u8868\u540e\u9762\u653e\u4e00\u4e2a\u5feb\u6377\u6309\u94ae\uff0c\u5148\u6dfb\u52a0\uff0c\u7136\u540e\u518d\u9009\u3002<\/p>\n

\u90a3\u4e48\u95ee\u9898\u5c31\u6765\u4e86\uff0c\u5982\u679c\u6309\u7167\u4e0a\u9762\u7684\u64cd\u4f5c\uff0c\u5f80\u5f80\u9700\u8981\u5f88\u591a\u6b65\u9aa4\uff0c\u80fd\u4e0d\u80fd\u5f53\u6ca1\u6709\u53ef\u9009\u9879\u76ee\u65f6\uff0c\u76f4\u63a5\u5728\u4e0b\u62c9\u5217\u8868\u4e0a\u8f93\u5165\u5462\uff1f<\/p>\n

\u7b54\u6848\u662f\u53ef\u4ee5\u7684\u3002\u4e0b\u9762\u5c31\u662f\u7528 JS \u5b9e\u73b0\u4e86\u4e0b\u62c9\u5217\u8868\u4e0a\u81ea\u5b9a\u4e49\u9009\u9879\u7684\u529f\u80fd\uff0c\u8bf7\u53c2\u8003\u3002<\/p>\n

\n
\n
Code<\/b>\u00a0\u00a0\u00a0View<\/a>Print<\/a><\/div>\n<\/div>\n
    \n
  1. <!DOCTYPE\u00a0html><\/li>\n
  2. <html><\/li>\n
  3. \u00a0\u00a0\u00a0\u00a0<head><\/li>\n
  4. \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<title>\u53ef\u7f16\u8f91\u7684\u4e0b\u62c9\u5217\u8868<\/title><\/li>\n
  5. \u00a0\u00a0\u00a0\u00a0<\/head><\/li>\n
  6. \u00a0\u00a0\u00a0\u00a0<style\u00a0type=\"text\/css\"<\/span>><\/li>\n
  7. \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0.cls_select_span\u00a0{<\/li>\n
  8. \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0position<\/span>:absolute<\/span>;<\/li>\n
  9. \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0border<\/span>:1pt<\/span>\u00a0solid<\/span>\u00a0#c1c1c1<\/span>;<\/li>\n
  10. \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0overflow<\/span>:hidden<\/span>;<\/li>\n
  11. \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0width<\/span>:188px<\/span>;<\/li>\n
  12. \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0height<\/span>:19px<\/span>;<\/li>\n
  13. \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0clip<\/span>:rect(-1px<\/span>\u00a0190px<\/span>\u00a0190px<\/span>\u00a0170px<\/span>);<\/li>\n
  14. \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0}<\/li>\n
  15. <\/li>\n
  16. \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0.cls_input_span\u00a0{<\/li>\n
  17. \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0position<\/span>:absolute<\/span>;<\/li>\n
  18. \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0border-top<\/span>:1pt<\/span>\u00a0solid<\/span>\u00a0#c1c1c1<\/span>;<\/li>\n
  19. \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0border-left<\/span>:1pt<\/span>\u00a0solid<\/span>\u00a0#c1c1c1<\/span>;<\/li>\n
  20. \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0border-bottom<\/span>:1pt<\/span>\u00a0solid<\/span>\u00a0#c1c1c1<\/span>;<\/li>\n
  21. \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0width<\/span>:170px<\/span>;<\/li>\n
  22. \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0height<\/span>:19px<\/span>;<\/li>\n
  23. \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0}<\/li>\n
  24. <\/li>\n
  25. \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0.cls_option_defined\u00a0{<\/li>\n
  26. \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0color<\/span>:#c2c2c2<\/span>;<\/li>\n
  27. \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0}<\/li>\n
  28. <\/li>\n
  29. \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0.cls_select\u00a0{<\/li>\n
  30. \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0width<\/span>:190px<\/span>;<\/li>\n
  31. \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0height<\/span>:20px<\/span>;<\/li>\n
  32. \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0margin<\/span>:-2px<\/span>;<\/li>\n
  33. \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0}<\/li>\n
  34. <\/li>\n
  35. \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0.cls_input\u00a0{<\/li>\n
  36. \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0width<\/span>:170px<\/span>;<\/li>\n
  37. \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0height<\/span>:15px<\/span>;<\/li>\n
  38. \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0border<\/span>:0pt<\/span>;<\/li>\n
  39. \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0}<\/li>\n
  40. \u00a0\u00a0\u00a0\u00a0<\/style><\/li>\n
  41. <\/li>\n
  42. \u00a0\u00a0\u00a0\u00a0<body><\/li>\n
  43. <\/li>\n
  44. \u00a0\u00a0\u00a0\u00a0<span\u00a0class=\"cls_select_span\"<\/span>><\/li>\n
  45. \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<select\u00a0id=\"id_select\"<\/span>\u00a0class=\"cls_select\"<\/span>\u00a0onChange=\"selectOnChangeFunc()\"<\/span>><\/li>\n
  46. \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<option\u00a0value=\"\"<\/span>\u00a0class=\"cls_option_defined\"<\/span>>---\u81ea\u5b9a\u4e49---<\/option><\/li>\n
  47. \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<option\u00a0value=\"\u5f00\u53d1\u90e8\"<\/span>>\u5f00\u53d1\u90e8<\/option><\/li>\n
  48. \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<option\u00a0value=\"\u5e02\u573a\u90e8\"<\/span>>\u5e02\u573a\u90e8<\/option><\/li>\n
  49. \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<option\u00a0value=\"\u9500\u552e\u90e8\"<\/span>>\u9500\u552e\u90e8<\/option><\/li>\n
  50. \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/select><\/li>\n
  51. \u00a0\u00a0\u00a0\u00a0<\/span><\/li>\n
  52. \u00a0\u00a0\u00a0\u00a0<span\u00a0class=\"cls_input_span\"<\/span>><\/li>\n
  53. \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<input\u00a0type=\"text\"<\/span>\u00a0id=\"id_input\"<\/span>\u00a0class=\"cls_input\"<\/span>\u00a0value=\"\u53ef\u9009\u62e9\u4e5f\u53ef\u81ea\u5b9a\u4e49\u8f93\u5165\"<\/span>><\/li>\n
  54. \u00a0\u00a0\u00a0\u00a0<\/span><\/li>\n
  55. <\/li>\n
  56. \u00a0\u00a0\u00a0\u00a0<script><\/li>\n
  57. \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0function\u00a0selectOnChangeFunc()\u00a0{<\/li>\n
  58. \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0document.getElementById('id_input').value\u00a0=\u00a0document.getElementById('id_select').options[document.getElementById('id_select').selectedIndex].value;<\/li>\n
  59. \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0}<\/li>\n
  60. \u00a0\u00a0\u00a0\u00a0<\/script><\/li>\n
  61. \u00a0\u00a0\u00a0\u00a0<\/body><\/li>\n
  62. <\/html><\/li>\n<\/ol>\n<\/div>\n

    Good Luck\uff01<\/p>\n","protected":false},"excerpt":{"rendered":"

    \u5728\u9879\u76ee\u5f00\u53d1\u4e2d\uff0c\u5f80\u5f80\u6709\u8fd9\u79cd\u9700\u6c42\uff1a\u90a3\u5c31\u662f\u9700\u8981\u4e0b\u62c9\u9009\u62e9\u5df2\u6709\u7684\u6570\u636e\u5217\u8868\uff0c\u5f53\u6ca1\u6709\u81ea\u5df1\u9700\u8981\u7684\u6570\u636e\u65f6\uff0c\u5f80\u5f80\u9700\u8981\u53bb\u7ba1\u7406\u8fd9\u4e9b\u5217\u8868 […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[430],"tags":[217,420,159,687,415],"class_list":["post-2936","post","type-post","status-publish","format-standard","hentry","category-web","tag-html","tag-js-2","tag-web","tag-687","tag-415"],"_links":{"self":[{"href":"http:\/\/www.menglanglang.cn\/index.php?rest_route=\/wp\/v2\/posts\/2936","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/www.menglanglang.cn\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/www.menglanglang.cn\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/www.menglanglang.cn\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/www.menglanglang.cn\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=2936"}],"version-history":[{"count":1,"href":"http:\/\/www.menglanglang.cn\/index.php?rest_route=\/wp\/v2\/posts\/2936\/revisions"}],"predecessor-version":[{"id":2937,"href":"http:\/\/www.menglanglang.cn\/index.php?rest_route=\/wp\/v2\/posts\/2936\/revisions\/2937"}],"wp:attachment":[{"href":"http:\/\/www.menglanglang.cn\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=2936"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/www.menglanglang.cn\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=2936"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/www.menglanglang.cn\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=2936"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}