본문 바로가기
프로그래밍/jquery

input selectbox radio checkbox 각요소별 접근 방법

by 마루의 일상 2023. 4. 14.
728x90
반응형

다음은 각각의 HTML 폼 요소에 접근하는 방법입니다.

  1. Select Box:
  • jQuery: $("#selectBoxId")
  • JavaScript: document.getElementById("selectBoxId")
  1. Radio Button:
  • jQuery: $("input[name='radioButtonName']:checked")
  • JavaScript: document.querySelector("input[name='radioButtonName']:checked")
  1. Checkbox:
  • jQuery: $("#checkBoxId")
  • JavaScript: document.getElementById("checkBoxId")
  1. Textarea:
  • jQuery: $("#textareaId")
  • JavaScript: document.getElementById("textareaId")

모든 요소에 대해 접근하는 방법은 jQuery를 사용하는 것이 좋습니다. 다음은 jQuery를 사용하여 각각의 요소에 대해 접근하는 방법입니다.

  1. Select Box:
  • jQuery: $("#selectBoxId").val()
  1. Radio Button:
  • jQuery: $("input[name='radioButtonName']:checked").val()
  1. Checkbox:
  • jQuery: $("#checkBoxId").prop("checked")
  1. Textarea:
  • jQuery: $("#textareaId").val()

또한, 각 요소에 이벤트를 바인딩하는 방법은 다음과 같습니다.

  1. Select Box:
  • jQuery: $("#selectBoxId").change(function() { ... })
  1. Radio Button:
  • jQuery: $("input[name='radioButtonName']").change(function() { ... })
  1. Checkbox:
  • jQuery: $("#checkBoxId").change(function() { ... })
  1. Textarea:
  • jQuery: $("#textareaId").change(function() { ... })
728x90
반응형