>웹 프론트엔드 >JS 튜토리얼 >JavaScript 기본 객체_기본 지식

JavaScript 기본 객체_기본 지식

WBOY
WBOY원래의
2016-05-16 19:20:521047검색

작성자: excelence Repost 편집 날짜: 2004년 6월 15일

이 기사는 JavaScript에 관한 것이 아니라 Notes/Domino의 JavaScript에 관한 것입니다!
그렇지만 그래도 한 번 볼만한 가치가 있습니다!
무엇이든 얻으시길 바랍니다!

라디오 버튼, 체크박스 및 JavaScript의 재미있는 기능을 자세히 살펴보세요.

JavaScript의 모든 것은 객체로 시작하므로 객체 모델과 몇 가지 일반적인 객체부터 시작하겠습니다. 이 기사는 단지 JavaScript에 관한 것이 아니라 Notes/Domino의 JavaScript에 관한 것임을 기억하십시오.


창은 객체 모델의 최상위 객체입니다. 일반적으로 창은 브라우저입니다. 창에 프레임 구조가 있는 경우 각 프레임 구조는 차례로 최상위 창(브라우저)에 포함된 작은 창입니다. 프레임 구조에 대해서는 다른 글에서 다루겠지만 지금은 브라우저에 웹 페이지가 하나만 있는 상황을 살펴보겠습니다.

창에는 주소(즉, URL), 브라우저 하단에 있는 상태 표시줄의 텍스트 등과 같은 속성이 있으며 열기 및 닫기와 같은 메서드도 있습니다. . 일반적으로 창은 개체 계층의 최상위 수준에 있기 때문에 JavaScript에서는 창이 이미 존재한다고 가정하므로 의도적으로 작성할 필요가 없습니다. 같은 효과.

창은 웹 페이지이고 개체 계층 구조는 문서에서 시작됩니다. Window.document로 참조하거나 간단히 문서로 참조할 수 있습니다. 창당 하나의 문서만 있습니다. 문서에는 브라우저에 따라 다양한 옵션이 있습니다. MSIE에서 document.all 배열에는 문서의 모든 개체가 포함됩니다. Netscape Navigator의 일부 버전에서는 document.layers 배열에 액세스할 수 있습니다. 각 브라우저는 객체를 다르게 해석하지만 양식 배열은 모든 브라우저에서 액세스할 수 있습니다.

이론적으로 각 문서에는 하나 이상의 양식이 포함되지만 여러 개가 포함될 수도 있습니다. 그러나 Notes에서는 특정 기능을 수행하기 위해 HTML 코드를 명시적으로 작성하지 않는 한(저는 절대 그렇게 하지 않습니다) 일반적으로 하나의 양식만 있습니다. 그러나 양식이 여러 개 있을 수 있으므로 양식을 참조할 때 여전히 배열 요소를 통해 양식을 참조해야 하며 아래 첨자는 0부터 시작합니다. doc.CompanyName(0)과 같이 괄호를 사용하여 아래 첨자 숫자를 묶는 LotusScript와 달리 JavaScript에서는 일반적으로 대괄호로 묶인 배열 아래 첨자를 참조하는 숫자를 볼 수 있습니다. 따라서 다음과 같은 방법으로 양식을 참조해야 합니다:



window.document.forms[0]


또는 축약형:



document.forms[0];


엄밀히 말하면 위의 방법이 양식을 참조하는 유일한 방법은 아닙니다.


document.forms[0];

document.forms(0)

document.forms.0; 🎜>그러나 흔히 볼 수 있는 것은 여전히 ​​괄호 안에 있는 접근 방식입니다. 각 줄 끝에 세미콜론을 추가했는데 이는 JavaScript와 수식 언어 간의 유사점 중 하나입니다. 각 명령문 끝에 세미콜론을 추가해야 합니다. 수식 언어와 달리 JavaScript에서는 세미콜론이 항상 필요한 것은 아닙니다. 일부 브라우저는 다른 브라우저보다 세미콜론 없이 JavaScript 문을 실행할 수 있는 능력이 더 뛰어나므로 때때로 세미콜론을 건너뛸 수 있지만 모든 문에 세미콜론을 추가하는 습관을 들이는 것이 좋습니다.

양식에 도달하면 가장 관심 있는 요소에 액세스할 수 있습니다. 양식은 JavaScript를 사용하여 양식에서 처리할 필드, 버튼, 텍스트, 이미지 및 기타 요소에 대한 컨테이너입니다.

몇 가지 간단한 요소
LotusScript의 경우 한 가지 언급할 가치가 있습니다. 텍스트, 라디오 버튼, 목록 상자, 확인란 등과 같이 서식 있는 텍스트 도메인 외부의 요소를 제외하고 다음을 수행할 수 있습니다. 값을 얻으려면 거의 동일한 코드를 사용하십시오. 예: "위치" 필드가 있는 경우 유형에 관계없이 다음 LotusScript 코드를 사용하여 해당 값을 가져올 수 있습니다.



fieldVals = doc.Location


또는 다음과 같습니다.



fieldVals = doc.GetItemValue("Location")


LotusScript에서 필드 유형은 다음과 같습니다. 원하는 값(값의 배열)을 가져오는 코드는 중요하지 않습니다. 불행히도 이것은 JavaScript에서는 작동하지 않습니다. JavaScript에서는 옵션(예: 라디오 버튼, 확인란 또는 텍스트)을 표시하는 것 외에도 다양한 유형의 필드가 Notes와 달리 서로 다른 방식으로 처리되어야 하는 다양한 개체 유형입니다. 인용하다. 사실 절대적인 것은 아니며 일부 개체는 유사하지만 참조 프로세스가 LotusScript만큼 원활하지 않습니다. 코드가 올바르게 실행되도록 하려면 코드에서 도메인(이름) 오류를 수동으로 찾는 데 많은 시간을 소비해야 하며 이는 보기에 좋지 않을 것입니다.

먼저 알아야 할 것은 JavaScript에는 소위 Rich-Text 도메인이 없으며 HTML에도 그런 것이 없다는 것입니다.Notes는 브라우저에 배치할 수 있는 서식 있는 텍스트 Java(JavaScript 아님) 애플릿을 제공하므로 서식 있는 텍스트의 일부 기능을 얻을 수 있지만 JavaScript를 사용하여 프로그래밍할 수는 없으며 실제 HTML 개체 유형이 아닙니다.

Notes 개발자를 더욱 놀라게 하는 것은 웹에 숫자나 시간 필드가 없다는 것입니다. HTML 필드는 모두 텍스트 유형입니다. 이를 사용하여 수량이나 단가와 같은 숫자 정보를 수집할 수 있지만 저장되는 데이터는 여전히 텍스트입니다. 숫자처럼 사용하려면 숫자형으로 변환해야 합니다. 나중에 자세히 설명하겠습니다. 이제 Notes의 @Prompt 대화 상자에 입력한 정보와 마찬가지로 모든 것이 텍스트라는 점을 인식하세요.


그림 1

양식 만들기
더 깊이 이해하기 위해 저의 도움을 받아 작은 실험을 해보겠습니다. Domino Designer를 열고, 새 양식을 생성하고, 양식에 "편집 가능한 필드 값 가져오기"라는 버튼과 "CreatedBy"라는 텍스트 필드를 생성하고, 이 필드의 기본값을 @V3UserName으로 설정합니다(그림 참조). 1).

R5 Designer를 사용하시는 경우, 트리거 버튼의 언어를 JavaScript로 변경해주세요. 저처럼 R6의 Designer를 사용한다면 좀 더 번거롭습니다. Notes/Domino 6(ND6)에서는 브라우저에서 JavaScript를 사용하는 것처럼 Notes 클라이언트에서 JavaScript를 사용할 수 있습니다. 더 중요한 것은 동일한 버튼이 다른 클라이언트에서 다른 코드를 실행할 수 있다는 것입니다. 그림 2에는 작성한 코드가 Notes("클라이언트")에서 실행될지 아니면 브라우저("웹")에서 실행될지 결정할 수 있는 몇 가지 옵션이 나와 있습니다.


그림 2


그림 3

이 기능은 다양한 환경에서 다양한 코드를 실행할 때 매우 유용하지만 어떻게 해야 할까요? 두 환경에서 동일한 코드를 실행하면 어떻게 되나요? 물론, 버튼 코드를 복사하는 것보다 더 좋은 방법이 있습니다. 오른쪽 드롭다운 목록에서 하단의 Common JavaScript를 선택하여 두 환경에 대한 코드를 동시에 작성할 수 있습니다(그림 3).

이 예에서는 'Common JavaScript'를 선택합니다.

버튼 스크립트에서 사용자에게 CreatedBy 필드 값을 묻는 코드를 입력합니다. 이전 기사를 읽으셨다면 JavaScript에서 점을 사용하여 계층적 요소를 구분할 수 있다는 것을 아실 것입니다. 버튼 스크립트는 다음과 같아야 합니다.



alert(document.forms[0].CreatedBy.value)


JavaScript에 유의하는 것이 중요합니다. 대소문자를 구분합니다. 이 규칙은 JavaScript 요소(문서, 양식 등)(첫 글자는 소문자)뿐만 아니라 필드 이름에도 유효합니다. 필드에서 사용하는 대/소문자 구분 효과는 코드에 충실하게 반영되어야 합니다. 브라우저 [디자인>웹 브라우저에서 미리 보기>Internet Explorer(또는 자체 브라우저)]에서 버튼 기능을 실험해 보세요. Domino R6 Designer를 사용하는 경우 Notes 클라이언트에서 실험해 볼 수 있습니다(디자인>Notes에서 미리보기).


그림 4

로컬 데이터베이스(서버에 해당)로 테스트하는 경우 브라우저에 표시되는 사용자 이름은 이름 대신 "Anonymous"입니다. , Notes 클라이언트의 이름입니다. 그 이유는 웹페이지를 이용하여 로컬 데이터베이스에 접속할 때 서버에 로그인하지 않은 상태이고, 브라우저는 귀하가 누구인지 알 수 없기 때문입니다. 하지만 Notes에서는 로컬이든 서버이든 로그인을 해야 시스템을 사용할 수 있습니다. 이것이 두 클라이언트의 미묘한 차이점입니다.

또 다른 차이점은 웹에 계산된 필드가 없다는 점입니다. 그렇다고 해서 양식에 계산된 필드를 추가할 수 없다는 의미는 아닙니다. 계산된 필드를 추가할 수 있으며 해당 필드가 숨겨지지 않는 한 계산된 값이 웹 페이지에 표시됩니다. 요점은 필드가 거기에 표시되더라도 HTML은 일반적으로 필드를 정의하지 않고 해당 필드를 처리한다는 것입니다. CreatedBy 필드를 편집 가능한 필드가 아닌 계산된 필드로 변경하면 다시 테스트해 보면 무슨 뜻인지 알 수 있으며 그림 4와 유사한 메시지가 표시됩니다.

그런데 Notes 클라이언트(R6)에서 실행해보면 계산된 도메인에도 오류가 없습니다. 솔직히 이 기능이 좋은 기능인지 나쁜 기능인지 아직 결론을 내리지 못했지만, 우리는 그렇게 생각합니다.

여기서 생성된 오류는 매우 중요합니다. JavaScript에서 생성된 오류는 코드 디버깅에 매우 유용하기 때문입니다. 그런 다음 "document.forms.0.CreatedBy.value"가 null이거나 개체가 아니라는 메시지가 표시되면 원하는 데이터를 얻지 못했다는 의미입니다.

브라우저로 돌아가서 배경을 마우스 오른쪽 버튼으로 클릭하고 "소스 보기"를 선택하면 웹 페이지 아래에 숨겨진 HTML 코드가 표시됩니다. 코드를 간단히 탐색하면 다음과 같은 버튼 및 계산된 필드에 대한 참조를 볼 수 있습니다.





작성자:Anonymous


페이지 형식을 지정하면 코드에 글꼴, 단락 또는 기타 마크업이 버튼 및 계산된 필드의 코드와 혼합되어 있을 수 있습니다. 이는 문서 형식을 지정하는 데 사용되며 여기 토론에서는 무시할 수 있습니다. "익명"은 양식의 또 다른 단어이며 도메인에서 생성되었음을 상기시키는 표시가 양쪽에 없습니다. 소스 코드에서는 익명과 "작성자" 사이에 차이가 없습니다. 도메인 앞에 두 개의 정적 텍스트가 있습니다(로그인한 경우 익명 대신 귀하의 이름이 표시됩니다).

비교를 위해 CreatedBy 필드를 다시 편집 가능한 텍스트로 변경하고 양식을 저장한 다음 브라우저로 돌아가서 페이지를 새로 고친 다음 페이지의 소스 파일을 보면 다음과 같습니다.





작성자:


Anonymous(또는 귀하의 이름)라는 단어 대신 HTML 코드가 있습니다. 도메인(또는 엄밀히 말하면 HTML 텍스트 입력 상자)에 대한 것입니다. 이름은 "CreatedBy"이고 값은 "Anonymous"입니다.이는 JavaScript를 통해 얻을 수 있는 속성이지만 일반 텍스트에는 이러한 속성이 없습니다. 따라서 적어도 브라우저에서는 JavaScript를 사용하여 계산된 필드를 참조할 수 없습니다. 또 다른 혼란스러운 점은 문서가 편집 불가능한 상태에 있을 때 편집 가능한 필드라도 JavaScript를 사용하여 참조할 수 없다는 것입니다. 즉, 문서를 저장하고 편집 모드로 설정하지 않고 다시 열면 페이지의 HTML 코드는 CreatedBy 필드가 계산된 필드인 것처럼 동일합니다. JavaScript의 또 다른 흥미로운 점은 Domino 외부에서는 양식의 편집 및 비편집 상태를 처리할 기회가 많지 않다는 점이며, Domino 개발자에게는 이것이 큰 문제입니다.

버튼과 필드가 입력 개체로 변환되는 것을 확인하셨나요? 이것이 HTML이 작동하는 방식입니다. 혼란스러운 점은 두 객체 모두 value 속성을 가지고 있다는 것입니다. 버튼의 경우 값은 "편집 가능한 필드 값 가져오기"입니다. 이는 버튼의 레이블인 것 같지만 필드 값은 실제 값입니다. 일부 다른 유형의 객체에는 값과 텍스트 속성이 모두 있습니다. 당신도 나와 같다면, 무엇이 무엇인지 파악하는 데 어려움을 겪을 때가 있습니다! 내 경험에 따르면 가장 쉬운 방법은 웹 페이지의 HTML 코드를 읽는 것입니다.

다중 값
HTML 필드에는 Notes 필드와 같은 다중 값 속성이 없습니다. 이렇게 해 보세요. 두 번째 버튼과 두 번째 필드를 양식에 추가하세요. 필드 이름을 "Letters"로 지정하고 편집 가능한 텍스트를 입력한 다음 "여러 값 허용" 확인란을 선택합니다. 기본값을 다음과 같이 문자 목록으로 작성합니다.



"A":"B":"C":"D":"E":"F":"G "


버튼 이름을 "여러 값 가져오기"로 지정하고 다음 JavaScript 코드를 입력하세요.



alert(document.forms[0].Letters.value) ;


이 필드의 값을 다른 구분 기호로 변경할 수 있지만 버튼을 클릭하면 어떤 구분 기호를 사용하든 항상 모든 필드에 대한 메시지가 표시됩니다. 값. 이는 Notes 클라이언트에서 실행되는 @Formulas 및 LotusScript와 대조됩니다. @Prompt를 사용하면 표시되는 프롬프트는 필드의 첫 번째 값인 "A"입니다. LotusScript를 사용하여 하나의 값만 표시할 수도 있지만 배열 첨자를 지정해야 합니다. 그렇지 않으면 오류 메시지가 표시됩니다. 수식이나 LotusScript 모두 프롬프트 문에서 다중 값 필드의 모든 값을 가져올 수 없습니다.

그 이유는 Notes 언어에서는 필드에 실제로 여러 값이 있기 때문입니다. HTML 및 JavaScript의 경우 값은 하나만 있습니다. 웹 페이지의 소스 코드를 다시 보면 다음과 유사한 코드를 찾을 수 있습니다.






값은 " 한 쌍" 큰따옴표로 묶인 구분된 값입니다. 개별 값을 분리하는 방법은 나중에 자세히 설명하겠지만 지금은 웹에서 다중값이 정확히 다중값이 아니라는 점을 알아야 합니다(적어도 텍스트 입력 필드의 경우). 다른 유형의 필드는 텍스트 필드와 다르게 처리됩니다.

라디오 버튼
또 다른 흥미로운 점은 라디오 버튼입니다. Notes와 웹 페이지에 관한 한 Notes의 라디오 버튼은 웹에서 여러 값을 가진 단일 필드입니다. 같은 이름의 텍스트 상자입니다. 위 내용을 이해하려면 다음 예를 살펴보십시오.

양식에서 "RadioButtn"이라는 이름의 또 다른 새 필드를 추가합니다. 이름에서 알 수 있듯이 라디오 버튼 유형 필드로 변경합니다. 도메인 속성 창의 두 번째 탭에서 다음 옵션과 별칭을 입력합니다(그림 5):


그림 5



One |
2 | B

3 | C

4 | D


이 필드의 기본값을 첫 번째 옵션의 별칭으로 설정합니다. 문자 "A"를 따옴표로 묶습니다.이제 브라우저에서 양식을 미리 보고 소스 파일을 보면 라디오 버튼의 코드가 일반 필드의 코드와 매우 다르다는 것을 알 수 있습니다. HTML 코드는 다음과 유사합니다.



One


Two


3개


4개


여기서 몇 가지 사항에 주의해야 합니다. 첫째, 4개의 라디오 버튼 객체는 모두 RadioButtn이라는 동일한 이름을 가지므로 HTML과 JavaScript는 두 객체가 동일한 배열에 있는 객체임을 알 수 있습니다. 둘째, 각 옵션의 값은 표시되는 텍스트(예: "One", "Two" 등)가 아니라 옵션의 별칭입니다. 이는 표시되는 텍스트가 아닌 별칭을 Notes에 저장하는 것과 같습니다(물론 별칭이 없으면 저장된 값과 텍스트는 동일합니다). 마지막으로 첫 번째 옵션을 확인하는 방법은 첫 번째 라디오 버튼 문에 추가되는 HTML 문에 "checked"라는 단어를 사용하는 것입니다.

다른 버튼을 추가하고 다른 두 필드 값과 동일한 방식으로 RadioButtn 값을 가져오면 이상한 오류가 발생합니다. 즉, 다음 코드를 사용합니다.



alert(document.forms[0].RadioButtn.value);


"정의되지 않음"이라는 오류 대화 상자가 표시됩니다(그림 6 참조).


그림 6

여기서 문제는 값이 정의되지 않았다는 것이 아닙니다. 결국 위와 같이 라디오버튼의 코드에는 총 4개의 값이 들어있습니다. 즉, 문제는 적어도 여기서 사용된 RadioButtn 자체에 있습니다. 라디오 버튼은 입력 옵션의 배열입니다. 요소 중 하나의 값을 알고 싶다면 다음 코드를 지정해야 합니다.



alert( document.forms [0].RadioButtn[0].value);


현재 필드의 값 "A"가 반환되지만, 다른 옵션을 선택한 다음 버튼을 클릭하면 선택한 값 대신 여전히 "A"라는 메시지가 표시되는데 여전히 좋지 않습니다.

선택한 옵션의 값을 얻으려면 먼저 어떤 옵션이 선택되었는지 알아야 하며, 그런 다음 선택한 옵션의 아래 첨자 값을 사용하여 경고 문에서 현재 옵션의 값을 올바르게 참조해야 합니다. 즉, 첫 번째 옵션을 선택한 경우 RadioButtn[0].value를 가져와야 하고, 두 번째 옵션을 선택한 경우 RadioButtn[1].value를 가져와야 하는 식입니다.

JavaScript에서 특정 유형의 필드에는 현재 선택된 옵션의 배열 아래 첨자 값을 나타내는 selectedIndex 속성이 있습니다. 그러나 라디오 버튼은 운이 좋지 않았고 체크박스도 마찬가지였습니다. 현재 선택된 라디오 버튼의 값을 얻으려면 RadioButtn 배열 요소에서 "checked" 속성을 찾아야 합니다. LotusScript와 비교하여 LotusScript는 다른 유형의 필드를 작동하는 것과 마찬가지로 라디오 버튼의 현재 선택된 값을 얻을 수 있습니다. 매우 번거로운 일이지만, 그게 바로 그 일입니다.

다음은 버튼의 코드입니다:



var doc = document.forms[0]

for(i = 0; i
doc.RadioButtn.length; i ){

if(doc.RadioButtn.checked){

alert(doc.RadioButtn.value); 🎜>break ;

}

}


여기서 몇 가지 새로운 개념이 바로 등장합니다. 잠시 설명하겠습니다. 우선 이전 글을 읽어보시면 "var"는 LotusScript의 "Dim", "Set"처럼 JavaScript에서도 변수를 선언하거나 변수에 값을 할당하는데 사용된다는 것을 아실 겁니다.이 경우 document.forms[0]을 반복해서 입력하는 것을 피하기 위해 나중에 사용할 수 있도록 document.forms[0]을 변수 doc에 할당합니다.



var doc = document .forms[0];


다음은 루프입니다. 루프 본문에 코드가 없으면 다음과 같습니다.



for(i = 0; i
 }


조금 눈이 부시셨나요? 예전에는 이런 코드를 볼 때마다 현기증이 나곤 했는데, 보기만큼 나쁘지는 않습니다. 우선, 중괄호는 루프의 본문을 포함하는 데에만 사용됩니다. JavaScript의 for 루프에는 세 가지 옵션이 있습니다.

1. 변수 및 초기 값 계산(i=0)

2. 루프를 계속하는 방법(i
3. 계수 변수를 누적하는 방법(i).

첫 번째는 i=0입니다. 아주 간단합니다. 변수 i를 사용했고 초기값은 0입니다.

파트 2: i
루프 본문의 세 번째 매개변수인 i는 LotusScript 개발자를 위한 하위 수준 오류입니다. 이는 i 값이 i=i 1 값과 동일하다는 JavaScript의 간단한 방법입니다. 실제로 루프에서 두 가지 형식 중 하나를 사용할 수 있으므로 다음은 위와 동일합니다.



for(i = 0; i
}


i=i 1도 정상적으로 실행이 가능하지만, 문제는 i에 익숙해서 아무도 그렇게 하지 않는다는 점이다. 더 짧고 간단합니다. 값은 i--를 쓸 수도 있다는 것입니다. 이는 i=i-1과 동일하지만 물론 이 루프에서는 작동하지 않습니다. i로 할 수 있는 재미있어 보이는 일이 많이 있지만 그건 나중에 할 일입니다.

루프를 다시 살펴보세요. 세 개의 매개변수는 세미콜론으로 구분되고 괄호로 둘러싸여 있고, 루프 본문 코드는 중괄호로 둘러싸여 있으며, 루프 본문은 if 문입니다.



if(doc.RadioButtn.checked){

}


여기서 참과 거짓 진술도 괄호로 묶었습니다. 실험에서 doc.RadioButtn.checked는 충분한 정보를 제공하지 않는 것 같지만 루프와 함께 JavaScript 속기를 형성합니다. LotusScript를 사용하면 어떻게 될까요? 먼저 다음과 같이 현재 RadioButton 요소가 selected와 같은지 확인합니다.



doc.RadioButton[0] = "checked"


이후 check는 값이 아닌 속성이므로 위 코드는 올바르게 실행되지 않습니다. 또한 HTML에서는 따옴표로 묶이지 않은 것을 알 수 있습니다. 실제로 확인 여부는 "예" 또는 "아님"을 의미합니다. 더 정확하게 말하면 true 또는 false이므로 if 문의 의미는 다음과 같습니다. RadioButtn의 이 요소가 선택(선택)되면 즉, true이면 다음 작업을 수행합니다... 여기서 테스트는 다음과 같습니다. 진정성에 대한 언급이 전혀 없기 때문에 조금 이상합니다. 이것이 불편하다면 다음과 같은 if 문을 쉽게 작성할 수 있습니다.



if(doc.RadioButtn.checked == true){

}


여기서 true는 모두 소문자이고 두 개의 등호가 있다는 점에 유의하세요. LotusScript와 달리 JavaScript의 등호(=)는 다른 항목에 값을 할당하는 데에만 사용됩니다.



var doc = document.forms[0]


두 항목이 동일한지 비교하려면 두 개의 등호를 사용해야 합니다. 내 머릿속에서는 doc.RadioButtn.checked가 true와 같다는 의미라고 생각합니다. 이는 두 개의 등호를 사용하는 것을 기억하는 데 도움이 됩니다. 이중 기호 표시는 앰퍼샌드에도 적용됩니다. 하나는 문자를 추가하거나 연결하는 데 사용되며, 두 개는 if 문에서 두 개의 조건을 사용할 때와 같이 "and"를 나타내는 데 사용됩니다.

마지막으로 if 문 내부에는 경고문과 중단문이 있습니다. break는 JavaScript의 Exit For입니다. 라디오 버튼에는 하나의 옵션만 선택할 수 있으므로 루프가 종료됩니다.

버튼에 코드를 모두 입력하면 라디오 버튼 중 어떤 옵션을 선택하더라도 버튼을 클릭한 후 해당 옵션의 값이 올바르게 표시되는 것을 볼 수 있습니다. 좋습니다. 이제 JavaScript를 시작하게 되었습니다.

체크박스

체크박스는 라디오 버튼과 비슷합니다.양식에서 라디오 버튼 필드를 복사하고 이름을 "CheckBx"로 바꾸고 필드 유형을 "CheckBox"로 변경한 다음 양식을 저장하고 웹 페이지를 새로 고쳐 소스 파일을 봅니다. 확인란의 HTML 코드가 RadioButtn의 코드와 거의 동일하다는 것을 알 수 있습니다.



One


Two


3개


4개


실질적인 차이점은 도메인 이름이 아니라 유형이 라디오 버튼이 아닌 체크박스입니다. . 또 다른 차이점은 체크박스에서 여러 값을 선택할 수 있다는 점입니다. 라디오 버튼처럼 어떤 옵션이 선택되었는지 확인하기 위해 전체 체크박스를 반복해야 하지만 모두 선택되었는지 확인하기 전에는 순회를 멈출 수 없습니다. 체크박스 선택을 확인하는 버튼의 코드는 다음과 같습니다:



var doc = document.forms[0];

for(i = 0 ; i
if(doc.CheckBx.checked){

alert(doc.CheckBx.value)

}

}


지금쯤이면 이 코드에 어느 정도 익숙해졌을 것입니다. 도메인 이름이 변경되고 ' 빵'이라는 문구가 삭제되었습니다. 실제 프로그램에서 이 코드는 나보다 훨씬 더 많은 작업을 수행하지만 먼저 기본 사항을 편안하게 학습할 수 있기를 바랍니다.

더 많은 개체를 기다리는 중
배우고 싶은 분야가 몇 가지 더 있고 각각 고유한 특징이 있지만 이는 다른 기사를 위한 자료입니다. 이제 직접 실험해 보면서 여기에 있는 예제에 익숙해질 수 있습니다. 아직 다루지 않은 양식에 더 많은 필드를 추가하고 해당 HTML 소스 파일을 살펴보고 싶을 수도 있습니다. 여기서는 나중에 뵙겠습니다.

참고자료

이 글은 2003.6년 "로터스 매거진 중국어 간체판"에서 발췌한 것입니다. "로터스 매거진 중국어 간체판"은 IBM 로터스 기술을 집중적으로 다루는 국내 최초의 간행물이며, 그 내용은 미국의 Lotus 관련 최고 기술 간행물은 Lotus 관리자 및 개발자를 대상으로 하며 최신의 최첨단 Lotus 관련 기술을 보여줍니다. 무료 구독 신청을 환영합니다.
Lotus 관련 주제: Lotus에 관심이 있는 개발자라면 Lotus 제품군에 대해 더 알고 싶고, Lotus 제품이 다른 IBM 제품과 함께 작동하는 방식, Lotus가 XML, 웹 서비스 등을 지원하는 방식에 대해 알고 싶습니다. 업계의 개방형 표준과 J2EE 개발에 Lotus를 사용하는 방법을 기다리는 동안 IBM DeveloperWorks China 웹사이트에서 Lotus 관련 주제를 즉시 방문하세요. 여기에는 귀하의 개발에 도움이 될 관련 기사, 튜토리얼 및 레드 북이 신중하게 수집되어 있습니다.
활성 드롭다운 목록 상자 및 퍼지 쿼리 문제에 대해


드롭다운 목록 상자에 텍스트를 입력한 다음, 퍼지 쿼리의 결과를 표시하고 싶습니다. 드롭다운 항목의 데이터 테이블 클래스에 다음 코드를 작성했는데


              



    
   <script> <BR>var onecount; <BR>coecount=0; <BR>function changelocation(locationid) <BR>{ <BR> var locationid=this.classid.text; <BR> tiaojian=locationid; <BR> <% <BR>strConnString = "Provider=Microsoft.Jet.OLEDB.4.0;Data Source=" & Server.MapPath("Database/bgxt.mdb") <BR>set db = Server.CreateObject("ADODB.Connection") <BR>db.open strConnString <BR>Set rs= Server.CreateObject("ADODB.Recordset") <BR>sql="select * from class where Nclass like '"&tiaojian&"'" <BR> rs.open sql,db,1,1 <BR> count=0 <BR> do while not rs.eof <BR> %> <BR> subcat[<%=count%>]=new array("<%=trim(rs("Nclass"))%>","<%= trim(rs("classid"))%>","<%= trim(rs("Nclassid"))%>"); <BR> <% rs.movenext <BR> loop <BR> rs.close <BR> %> <BR> onecount=<%=count%>; <BR> document.myfrom.classid.length=0; <BR> var locationid=locationid; <BR> var i; <BR> for(i=0;i<onecount;i++) <BR> { <BR> document.myform.classid.options[document.myform.classid.length]=new option(subcat[i][0],subcat[i][1]); <BR> document.myform.classid.length=documen.myform.classid.lenght+1; <BR> } <BR></script>

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
이전 기사:시나 슬라이딩 도어 기술_자바스크립트 기술다음 기사:시나 슬라이딩 도어 기술_자바스크립트 기술

관련 기사

더보기