1
00:00:00,600 --> 00:00:05,350
이 비디오에서 우리는 사용자 입력을 얻는 세 가지 추가 방법에 대해 이야기 할 것입니다.

2
00:00:05,370 --> 00:00:10,830
첫 번째 라디오 버튼은 실제로 우리가 본 입력 태그의 또 다른 유형입니다.

3
00:00:11,010 --> 00:00:12,740
확인란과 비슷합니다.

4
00:00:12,780 --> 00:00:16,170
다음 select 태그는 우리가 드롭 다운 메뉴를 얻는 방법입니다.

5
00:00:16,230 --> 00:00:22,290
마지막으로 여러 줄로 된 텍스트 입력을 만드는 방법 인 텍스트 영역에 대해 이야기하겠습니다.

6
00:00:23,130 --> 00:00:26,900
그래서 나는 표준 HMO 상용구로 시작하겠습니다.

7
00:00:26,970 --> 00:00:33,570
계속해서 제목을 추가하여 저장하고 라디오 버튼을 추가하십시오.

8
00:00:33,750 --> 00:00:37,830
따라서 라디오 만 입력하기 만하면됩니다.

9
00:00:37,830 --> 00:00:46,570
그리고 저는 그것을 복제 할 것이고 다른 하나의 유형을 줄 것입니다. 왜냐하면 체크 박스만으로 그것들을 나란히 볼 수 있기 때문입니다.

10
00:00:46,650 --> 00:00:48,900
여기는 라디오 버튼입니다.

11
00:00:49,650 --> 00:00:51,850
내가 선택한 후에는 해제 할 수 없습니다.

12
00:00:51,870 --> 00:00:55,350
이 체크 박스는 켜고 끌 수 있습니다.

13
00:00:55,470 --> 00:01:07,310
차이점은 실제로 사용자가 선택할 수있는 확인란을 선택하거나 사용자가 확인할 수있는 5 가지 선택 항목이 있다고 가정 해 보겠습니다.

14
00:01:07,320 --> 00:01:09,890
우리가 사용자들에게 그들을 선택하도록 요구한다고 가정 해 봅시다.

15
00:01:10,080 --> 00:01:12,800
이것은 직업 사이트이며 우리는 그들이 기술을 선택하기를 원합니다.

16
00:01:12,900 --> 00:01:21,960
우리는 그들에게 자바 스크립트를 말하고 HMO 또는 자바 스크립트로만 볼 수 있고, 라디오 버튼을 체크하고 체크하는 체크 박스 만 허용하기를 원합니다.

17
00:01:21,960 --> 00:01:26,280
그러나 일반적으로 사용자가 하나의 선택을 할 때 사용됩니다.

18
00:01:26,280 --> 00:01:36,210
따라서 일반적으로 웹 사이트의 예는 남성 또는 여성 또는 기타를 확인하도록 요구하는 성별과 같아야합니다.

19
00:01:36,600 --> 00:01:38,920
그리고 한 가지 선택 만 할 수 있습니다.

20
00:01:39,000 --> 00:01:41,360
당신은 선택할 수 없다는 것을 알 수 없습니다.

21
00:01:41,430 --> 00:01:58,090
요소 중 하나를 선택해야합니다. 예를 들어 고양이 또는 개를 선호하는 경우 사용자가 선택하는 양식이 있고 두 가지를 모두 선택할 수있는 옵션은 없습니다.

22
00:01:58,110 --> 00:02:03,470
불행히도이 세상에서 그것은 검은 색이나 흰색 중 하나를 선호 고양이 우리가 선호하는 개.

23
00:02:04,080 --> 00:02:07,430
그래서 우리는 두 개의 라디오 버튼을 갖게 될 것입니다.

24
00:02:07,650 --> 00:02:15,600
그리고 그것이 우리가 시작하는 전부라면 하나를 선택할 수 있고 다른 하나는 선택할 수 있습니다.

25
00:02:15,600 --> 00:02:16,650
우리가 원하는 것은 아닙니다.

26
00:02:16,650 --> 00:02:18,780
나는 오직 하나를 고를 수 있기를 원한다.

27
00:02:19,080 --> 00:02:24,550
따라서 내가하고 싶은 첫 번째 일은 양식을 작성하는 것입니다. 양식을 입력 양식으로 옮길 것입니다.

28
00:02:25,170 --> 00:02:31,290
그리고 지금 당분간은 그냥 요청을 받고 단지 페이지를 새로 고치는 기본 동작이되도록 그냥 두려고합니다.

29
00:02:31,650 --> 00:02:45,360
다음에 할 일은 레이블을 몇 개 추가하는 것입니다. 그래서 나는 개가 될 수 있도록 4 가지 구문을 사용합니다.

30
00:02:48,030 --> 00:02:51,570
그리고 우리는 우리의 의견과 I.D. 개.

31
00:02:51,650 --> 00:02:53,870
그러나 그것들은 일치해야합니다.

32
00:02:53,880 --> 00:02:55,690
여기 같은거야.

33
00:02:55,980 --> 00:03:06,120
고양이와 이드 고양이를위한 또 다른 라벨 태그.

34
00:03:06,210 --> 00:03:08,360
이제 신선하면 두 가지 선택이 있습니다.

35
00:03:08,430 --> 00:03:10,160
그러나 나는 여전히 둘 다 선택할 수 있습니다.

36
00:03:10,500 --> 00:03:20,550
그래서 우리가해야 할 일은 두 개의 라디오 버튼이 같은 선택을하는 방법을 알려주므로 하나 또는 둘 다를 선택할 수 있지만 한 가지 결정입니다.

37
00:03:20,550 --> 00:03:36,000
그렇게하기 위해서는 name 속성을 사용해야합니다. name 속성은 개별 입력에 이름을 부여하지만 mL은이를 참조 할 수 있으며 이름이 중요한 HGP 요청에 저장되거나 전송되는 방식이기도합니다.

38
00:03:36,270 --> 00:03:37,580
여기에 이름을 지어 보겠습니다.

39
00:03:37,620 --> 00:03:46,370
첫 번째 이름은 그냥 애완 동물 선택이라고하겠습니다.

40
00:03:47,610 --> 00:03:51,890
그런 다음 여기에 입력 할 때도 똑같은 이름을 지정하려고합니다.

41
00:03:52,200 --> 00:04:02,260
그리고 우리가 당신이 볼 수있는 이유는 바로 그들에게 같은 이름을 부여함으로써 그것들을 연결 시켜서 우리가 지금 하나를 선택할 수있게하는 것입니다.

42
00:04:02,340 --> 00:04:03,510
우리가 새로 고침하면.

43
00:04:03,650 --> 00:04:08,510
나는 개와 고양이를 클릭 할 수 있지만 둘 다 할 수는 없다.

44
00:04:10,050 --> 00:04:11,500
그리고 내가 한 가지 더 보여 드리겠습니다.

45
00:04:11,520 --> 00:04:14,400
양식의 끝에 버튼을 추가합시다.

46
00:04:15,630 --> 00:04:27,800
그리고 지금까지 보았던 것은 실제로 입력 유형이 양식 하단에있는 같음을 보여 주지만 버튼이 양식의 마지막 항목이면 양식을 제출할 것임을 보여주는 버튼을 보여줍니다. .

47
00:04:27,870 --> 00:04:35,490
따라서 제출할 최종 또는 입력 유형의 끝 버튼에 실제로 양식을 제출하는 입력 방법에는 몇 가지가 있습니다.

48
00:04:35,490 --> 00:04:38,250
이제 개들을 고르자.

49
00:04:38,250 --> 00:04:40,270
거기 유일한 유일한 선택.

50
00:04:40,380 --> 00:04:48,710
다른 입력과 마찬가지로 쿼리 문자열에서 무엇인가를 볼 수 있도록 이름이 애완 동물 선택이라는 것을 기억하십시오.

51
00:04:48,750 --> 00:04:58,020
내가 클릭 할 때 우리는 애완 동물 선택과 같거나 그 다음에 O N을 보거나 실제로는 기대했던 것과 다릅니다.

52
00:04:58,110 --> 00:05:04,710
그래서 우리는이 결정의 가치가 무엇인지 말할 필요가있는 한 가지를 놓치고 있습니다.

53
00:05:04,710 --> 00:05:09,210
그래서 그 값 속성 안에 value 태그를 추가하십시오.

54
00:05:09,360 --> 00:05:28,010
그리고 그냥이 값이 개가 될 것이라고 말하며이 고양이는 고양이가되어 어디에서 왔는지를 볼 수 있도록 모든 대문자가됩니다.

55
00:05:28,220 --> 00:05:28,690
승인.

56
00:05:28,790 --> 00:05:43,690
따라서 사용자가 애완 동물 선택 저장소에있는 개를 클릭하면 사용자가 값을 제출하거나 고양이를 클릭하거나 애완 동물 이름을 선택하면 값 대문자가 모두 대문자로 저장됩니다.

57
00:05:44,000 --> 00:05:50,170
그래서 당신에게 보여주기 위해 개를 클릭하자. 그리고 우리는 애완 동물 선택을 개와 같게 만든다.

58
00:05:50,360 --> 00:05:53,630
우리가 고양이를하면 우리는 고양이 때문에 애완 동물 선택을 얻습니다.

59
00:05:53,690 --> 00:06:01,260
그래서 우리가 이야기 할 다음 요소는 select 태그이고 select 태그를 사용하면 좋은 드롭 다운 메뉴를 만들 수 있습니다.

60
00:06:01,730 --> 00:06:03,300
그래서 태그 이름이 호출됩니다.

61
00:06:03,350 --> 00:06:04,510
그것은 단지 선택입니다.

62
00:06:04,690 --> 00:06:06,470
시작 및 종료 태그입니다.

63
00:06:06,860 --> 00:06:10,860
그리고 그저 그렇게하면 슬라이드가되고 내 페이지가 새로 고칩니다.

64
00:06:10,920 --> 00:06:13,040
실제로 이미 드롭 다운 메뉴가 있습니다.

65
00:06:13,060 --> 00:06:14,890
그것은 완전히 비어 있습니다.

66
00:06:14,930 --> 00:06:18,660
select 태그와 함께 옵션 태그를 사용합니다.

67
00:06:18,940 --> 00:06:25,150
그래서 우리가 사용하고자하는 가능한 모든 옵션을 위해 내부에 옵션 태그를 추가합니다.

68
00:06:25,430 --> 00:06:39,510
이제 사용자가 자신이 좋아하는 색상을 선택하도록하는 드롭 다운을하고 여기에서 몇 가지 옵션을 시도해 보겠습니다.

69
00:06:39,590 --> 00:06:46,810
빨간색 오렌지와 노란색입니다.

70
00:06:48,680 --> 00:06:53,780
당신이 볼 수 있듯이, 우리는 이미 우리의 선택으로 여기에 좋은 드롭 다운을 얻습니다.

71
00:06:54,270 --> 00:06:58,330
그리고 내가 쳤다면 오렌지를 선택하고 나는 쳤다.

72
00:06:58,940 --> 00:07:08,070
당신은 우리가 실제로 아무 것도 얻지 않는다는 것을 알게 될 것입니다. 우리가 개를 골라서 이번에 노란색으로 선택하면 그들이 우리를 좋아해요.

73
00:07:08,210 --> 00:07:13,940
나는 여전히 애완 동물 선택 만받습니다. 왜냐하면 우리가 제공하는 이름이 없기 때문입니다.

74
00:07:14,060 --> 00:07:21,360
그래서 우리 선택에 우리는 이름을 지어주고 그냥 fav라고 부르며 그냥 색으로 가자.

75
00:07:22,270 --> 00:07:29,170
그리고 내 페이지를 새로 고침하여 고양이를 클릭하자. 노란색을 클릭하고 여기를 클릭하면 내가 쳤다.

76
00:07:29,360 --> 00:07:33,810
나는 지금 애완 동물 선택 고양이를 얻고 색깔은 황색이다.

77
00:07:34,460 --> 00:07:54,150
그래서 당신이 볼 수있는 것은이 경우 노란색 맵을 선택한 옵션에 따라 브라우저는 텍스트가 그 옵션 안에 있다는 것을 취하고 이름 색상 아래 값으로 보냅니다.

78
00:07:54,170 --> 00:08:05,260
따라서 우리는 항상 요청에 포함 된 값이 드롭 다운의 사용자에게 표시되는 것과 동일하도록 항상 원하지는 않습니다.

79
00:08:05,260 --> 00:08:21,510
예를 들어 사용자가 기분을 선택하기를 원하면 현재의 기분은 무엇이라고 말하며 행복한 얼굴을 원합니다.

80
00:08:23,120 --> 00:08:29,860
가장 감정이없는 얼굴과 슬픈 얼굴.

81
00:08:31,780 --> 00:08:41,930
그리고 우리는이 이모티콘으로이 멋진 드롭 다운을 끝내지 만, 사용자가 행복을 선택할 때 우리는이 모든 것을 보내기를 원하지 않는다고 가정 해 봅시다.

82
00:08:42,200 --> 00:08:48,570
대신 우리는 행복하다는 말을 보내기를 원하거나 그렇게하기 위해 보낸 말을 원합니다.

83
00:08:48,670 --> 00:08:52,570
값 태그 인 값 태그를 사용합니다.

84
00:08:52,750 --> 00:08:54,990
그래서 우리는 가치가 같다고 말할 것입니다.

85
00:08:55,000 --> 00:09:04,720
해피가 중립이고 값이 같다고 가정 해 봅시다.

86
00:09:04,730 --> 00:09:10,220
이제 내가 올바른 강아지를 새로 고치면 밖에 나가서 클릭하십시오.

87
00:09:10,660 --> 00:09:14,890
당신은 애완 동물 선택을 얻을 수있는 것을 볼 수 있고, 색깔은 똑같다고합니다.

88
00:09:15,010 --> 00:09:24,030
그리고 물론 우리가 그 이름을 변경하고자하는 색으로 유지했기 때문에 그것은 우리의 마크 업이 의미 있고 실제적으로 의미가 있도록합니다.

89
00:09:24,230 --> 00:09:29,050
그래서 고양이는 너무 행복하고 기분은 행복과 같습니다.

90
00:09:29,060 --> 00:09:29,300
승인.

91
00:09:29,330 --> 00:09:33,140
따라서 선택에 대해 알아야 할 것이 전부입니다.

92
00:09:33,250 --> 00:09:37,250
또 다른 한 가지는 텍스트 영역 태그와 텍스트 영역입니다.

93
00:09:37,430 --> 00:09:44,330
나는 그것을 인도에 올려 놓을 것이고, 한 줄 이상의 입력을 만드는 좋은 방법이다.

94
00:09:44,380 --> 00:09:55,250
따라서이 입력 유형과 같은 텍스트 입력이 텍스트와 같고 한 줄임을 알았습니다.

95
00:09:55,250 --> 00:10:05,540
그러나 사용자에게 바이오를 요청하거나 잘 작동하지 않는 이력서 및이 매우 얇은 짧은 입력을 복사하여 붙여 넣기를 원할 경우 어떻게 될까요?

96
00:10:05,620 --> 00:10:09,390
그래서 textarea 실제로 select와 같은 또 다른 태그입니다.

97
00:10:09,430 --> 00:10:12,490
따라서 유형이있는 입력이 아닙니다.

98
00:10:12,530 --> 00:10:15,560
사실 그것은 별도의 형식 컨트롤입니다.

99
00:10:15,880 --> 00:10:19,690
그리고 그것이 작동하는 방식에는 두 가지 중요한 부분이 있습니다.

100
00:10:19,690 --> 00:10:27,690
첫 번째는 텍스트 영역 태그를 만들고 그 자체로이 텍스트 영역을 제공한다는 것입니다.

101
00:10:28,420 --> 00:10:37,720
그러나 우리가 할 수있는 것은 텍스트 영역이이 두 속성 행과 열을 얼마나 정확하게 사용 하는지를 지정하는 것입니다.

102
00:10:37,970 --> 00:10:40,040
그래서 여기에 보여 드리죠.

103
00:10:40,150 --> 00:10:48,080
10 행 50 열로 시작하여 내 텍스트 영역이 양방향으로 확장 된 것을 볼 수 있습니다.

104
00:10:48,230 --> 00:10:49,270
그러나 그것은 분명히 더 넓어졌습니다.

105
00:10:49,280 --> 00:10:55,370
이제 100 행을 원한다고 가정 해 봅시다. 그러면 훨씬 길어질 수 있습니다.

106
00:10:55,370 --> 00:11:01,060
따라서 기본적으로 텍스트 영역의 크기를 변경할 행 수와 열 수를 지정할 수 있습니다.

107
00:11:01,850 --> 00:11:08,540
그것에 관한 한 가지 다른 점은 이러한 다른 요소들과 마찬가지로 10에서 10 사이의 작은 요소로 돌아가는 것입니다.

108
00:11:08,650 --> 00:11:15,460
요청에서이 데이터를 보내고 싶다면 다른 요소와 마찬가지로이 입력을 제거해 봅시다.

109
00:11:15,670 --> 00:11:30,170
나는 그것에게 이름과 같은 이름을 부여 할 필요가 있고, 단지 단락이 어떤 텍스트로이 단락을 채우라고 말하자.

110
00:11:30,190 --> 00:11:33,800
나는 클릭하고 당신은 이것을 보거나 확장 할 수있다.